@extends('admin.layouts.app')
@section('title', get_setting('site_name').' | '.__('Asset assign report'))
@include('admin.asset.partials.page_styles')
@php use App\Support\Asset\AssetType; @endphp
@push('css')
<style>
    .asset-report-page .asset-stat {
        border: 1px solid #edf0f6;
        border-radius: 10px;
        background: #fff;
        padding: 12px 16px;
        text-align: center;
        height: 100%;
    }
    .asset-report-page .asset-stat .num { font-size: 1.35rem; font-weight: 800; line-height: 1.2; }
    .asset-report-page .asset-stat .lbl {
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: .05em;
        color: #64748b;
    }
    .asset-report-page .assign-table thead th {
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: .04em;
        white-space: nowrap;
    }
    .asset-report-page .assign-serial {
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
        font-size: 12px;
        color: #334155;
    }
    .asset-report-page .assign-type-badge,
    .asset-report-page .ack-badge {
        display: inline-flex;
        align-items: center;
        padding: 3px 8px;
        border-radius: 6px;
        font-size: 10px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .04em;
    }
    .asset-report-page .assign-type-badge {
        background: #f1f5f9;
        color: #475569;
        border: 1px solid #e2e8f0;
    }
    .asset-report-page .ack-badge.done { background: rgba(34, 197, 94, .12); color: #166534; border-radius: 999px; }
    .asset-report-page .ack-badge.pending { background: rgba(245, 158, 11, .14); color: #b45309; border-radius: 999px; }
    .asset-report-page .usage-mini { font-size: 12px; line-height: 1.4; }
    .asset-report-page .employee-report-card {
        border: 1px solid #edf0f6;
        border-radius: 12px;
        margin-bottom: 1rem;
        overflow: hidden;
    }
    .asset-report-page .employee-report-card .card-head {
        background: #f8fafc;
        border-bottom: 1px solid #edf0f6;
        padding: 0.85rem 1rem;
    }
    .asset-report-page .asset-filter-btn-label { visibility: hidden; display: block; }
    .asset-report-page .asset-filter-actions {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 6px;
        min-height: 38px;
    }
    .asset-report-page .asset-filter-actions .btn {
        display: inline-flex;
        align-items: center;
        height: 38px;
        white-space: nowrap;
    }
    .asset-report-page .report-hint {
        background: #f8fafc;
        border: 1px dashed #dbe3ef;
        border-radius: 10px;
        padding: 1.25rem;
        text-align: center;
        color: #64748b;
    }
    @media print {
        .asset-report-page .no-print { display: none !important; }
        .asset-report-page .employee-report-card { break-inside: avoid; page-break-inside: avoid; }
    }
</style>
@endpush
@section('content')
<div class="row asset-admin-page asset-report-page">
    <div class="col-xl-11 mx-auto mt-3 mb-4">
        <div class="d-flex flex-wrap justify-content-between align-items-start mb-3 no-print">
            <div class="mb-2 mb-md-0">
                <h4 class="mb-1">{{ __('Asset assign report') }}</h4>
                <p class="text-muted small mb-0">{{ __('View assigned assets by employee. Search one person or browse employees with active assignments.') }}</p>
            </div>
            <div class="d-flex flex-wrap" style="gap: 8px;">
                <a href="{{ route('asset.assign.list') }}" class="btn btn-outline-secondary btn-sm">
                    <i class="mdi mdi-format-list-bulleted mr-1"></i> {{ __('Assignment list') }}
                </a>
                @if(in_array($reportMode, ['single', 'all'], true))
                    <button type="button" class="btn btn-primary btn-sm" onclick="window.print()">
                        <i class="fas fa-print mr-1"></i> {{ __('Print') }}
                    </button>
                @endif
            </div>
        </div>

        <div class="row mb-3 no-print">
            <div class="col-md-4 mb-2 mb-md-0">
                <div class="asset-stat">
                    <div class="num text-dark">{{ $stats['total_assignments'] ?? 0 }}</div>
                    <div class="lbl">{{ __('Active assignments') }}</div>
                </div>
            </div>
            <div class="col-md-4 mb-2 mb-md-0">
                <div class="asset-stat">
                    <div class="num text-primary">{{ $stats['employees_with_assets'] ?? 0 }}</div>
                    <div class="lbl">{{ __('Employees with assets') }}</div>
                </div>
            </div>
            <div class="col-md-4 mb-2 mb-md-0">
                <div class="asset-stat">
                    <div class="num text-warning">{{ $stats['pending_ack'] ?? 0 }}</div>
                    <div class="lbl">{{ __('Pending acknowledgment') }}</div>
                </div>
            </div>
        </div>

        <div class="card asset-card no-print mb-3">
            <div class="card-header">
                <h5 class="mb-0">{{ __('Report filters') }}</h5>
            </div>
            <div class="card-body">
                <form action="{{ route('assign.asset.report') }}" method="GET">
                    <div class="form-row align-items-end">
                        <div class="form-group col-md-4 mb-2 mb-md-0">
                            <label class="small font-weight-bold text-uppercase text-muted">{{ __('Employee') }}</label>
                            <select name="staff_id" id="report_staff_id" class="form-control" style="width:100%">
                                <option value="">{{ __('Search employee…') }}</option>
                                <option value="all" @selected($selectedStaffId === 'all')>{{ __('All employees with assignments') }}</option>
                                @if(! empty($selectedStaff) && $reportMode === 'single')
                                    <option value="{{ $selectedStaff->id }}" selected>
                                        {{ $selectedStaff->user?->name ?? __('Unknown') }}
                                        ({{ $selectedStaff->user?->id ?? 'N/A' }})
                                        — {{ $selectedStaff->warehouse?->name ?? '-' }}
                                    </option>
                                @endif
                            </select>
                        </div>
                        <div class="form-group col-md-3 mb-2 mb-md-0" id="warehouse_filter_wrap"
                             style="{{ $selectedStaffId === 'all' ? '' : 'display:none' }}">
                            <label class="small font-weight-bold text-uppercase text-muted">{{ __('Branch') }}</label>
                            <select name="warehouse_id" class="form-control">
                                <option value="">{{ __('All branches') }}</option>
                                @foreach($warehouses as $warehouse)
                                    <option value="{{ $warehouse->id }}" @selected((int) ($warehouseId ?? 0) === (int) $warehouse->id)>
                                        {{ $warehouse->name }}
                                    </option>
                                @endforeach
                            </select>
                        </div>
                        <div class="form-group col-md-3 mb-2 mb-md-0" id="search_filter_wrap"
                             style="{{ $selectedStaffId === 'all' ? '' : 'display:none' }}">
                            <label class="small font-weight-bold text-uppercase text-muted">{{ __('Name / ID') }}</label>
                            <input type="search" name="search" class="form-control" value="{{ request('search') }}"
                                   placeholder="{{ __('Filter employee list…') }}">
                        </div>
                        <div class="form-group col-md-2 mb-0">
                            <label class="asset-filter-btn-label small font-weight-bold text-uppercase text-muted">&nbsp;</label>
                            <div class="asset-filter-actions">
                                <button type="submit" class="btn btn-primary btn-sm">
                                    <i class="fas fa-filter mr-1"></i> {{ __('View') }}
                                </button>
                                <a href="{{ route('assign.asset.report') }}" class="btn btn-light btn-sm">{{ __('Reset') }}</a>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>

        @if($reportMode === 'landing')
            <div class="report-hint no-print">
                <i class="mdi mdi-account-search mdi-36px d-block mb-2 text-muted"></i>
                <h5 class="mb-2">{{ __('Select an employee to view their report') }}</h5>
                <p class="mb-0 small">
                    {{ __('Search one employee, or choose “All employees with assignments” for a paginated list. Loading all :count employees at once is avoided for better performance.', ['count' => number_format($stats['employees_with_assets'] ?? 0)]) }}
                </p>
            </div>
        @elseif($reportMode === 'single' && $selectedStaff)
            <div class="card asset-card">
                <div class="card-header d-flex flex-wrap justify-content-between align-items-center">
                    <div>
                        <h5 class="mb-0">{{ $selectedStaff->user?->name ?? __('Unknown') }}</h5>
                        <small class="text-muted">
                            {{ __('Employee ID') }}: {{ $selectedStaff->user?->id ?? '—' }}
                            · {{ __('Branch') }}: {{ $selectedStaff->warehouse?->name ?? '—' }}
                            · {{ __('Assets') }}: {{ $assignments->count() }}
                        </small>
                    </div>
                </div>
                <div class="card-body p-0">
                    <div class="table-responsive">
                        <table class="table table-hover assign-table mb-0">
                            <thead class="thead-light">
                            <tr>
                                <th>{{ __('Category') }}</th>
                                <th>{{ __('Asset') }}</th>
                                <th>{{ __('Serial / code') }}</th>
                                <th>{{ __('Type') }}</th>
                                <th class="text-center">{{ __('Qty') }}</th>
                                <th>{{ __('Assigned') }}</th>
                                <th class="text-center">{{ __('Ack.') }}</th>
                                <th>{{ __('Usage') }}</th>
                            </tr>
                            </thead>
                            <tbody>
                            @if($assignments->isNotEmpty())
                                @include('admin.asset.partials.assign_report_rows', ['assignments' => $assignments])
                            @else
                                <tr>
                                    <td colspan="8" class="text-center text-muted py-4">@include('no_record_found')</td>
                                </tr>
                            @endif
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        @elseif($reportMode === 'all' && $staffPage)
            <div class="d-flex flex-wrap justify-content-between align-items-center mb-2">
                <p class="text-muted small mb-0">
                    {{ __('Showing employees with active assignments') }}
                    @if($staffPage->total() > 0)
                        — {{ $staffPage->firstItem() }}–{{ $staffPage->lastItem() }} {{ __('of') }} {{ $staffPage->total() }}
                    @endif
                </p>
            </div>

            @forelse($staffPage as $staff)
                @php $staffAssignments = $assignmentsByStaff->get($staff->id, collect()); @endphp
                <div class="employee-report-card">
                    <div class="card-head d-flex flex-wrap justify-content-between align-items-center">
                        <div>
                            <strong>{{ $staff->user?->name ?? __('Unknown') }}</strong>
                            <span class="text-muted small ml-2">
                                ID {{ $staff->user?->id ?? '—' }} · {{ $staff->warehouse?->name ?? '—' }}
                            </span>
                        </div>
                        <span class="badge badge-light">{{ $staffAssignments->count() }} {{ __('assets') }}</span>
                    </div>
                    <div class="table-responsive">
                        <table class="table table-sm table-hover assign-table mb-0">
                            <thead class="thead-light">
                            <tr>
                                <th>{{ __('Category') }}</th>
                                <th>{{ __('Asset') }}</th>
                                <th>{{ __('Serial / code') }}</th>
                                <th>{{ __('Type') }}</th>
                                <th class="text-center">{{ __('Qty') }}</th>
                                <th>{{ __('Assigned') }}</th>
                                <th class="text-center">{{ __('Ack.') }}</th>
                                <th>{{ __('Usage') }}</th>
                            </tr>
                            </thead>
                            <tbody>
                                @include('admin.asset.partials.assign_report_rows', ['assignments' => $staffAssignments])
                            </tbody>
                        </table>
                    </div>
                </div>
            @empty
                <div class="report-hint">
                    <p class="mb-0">{{ __('No employees with active assignments match your filters.') }}</p>
                </div>
            @endforelse

            @if($staffPage->hasPages())
                <div class="mt-3 no-print">{{ $staffPage->links() }}</div>
            @endif
        @endif
    </div>
</div>
@endsection

@section('script')
    @include('admin.asset.partials.scripts')
    <script>
        (function () {
            var $staff = $('#report_staff_id');

            function toggleAllFilters() {
                var isAll = $staff.val() === 'all';
                $('#warehouse_filter_wrap, #search_filter_wrap').toggle(isAll);
            }

            $staff.select2({
                width: '100%',
                allowClear: true,
                placeholder: @json(__('Search employee…')),
                minimumInputLength: 0,
                ajax: {
                    url: @json(route('assign.asset.report.staff.search')),
                    dataType: 'json',
                    delay: 250,
                    data: function (params) {
                        return { q: params.term || '' };
                    },
                    processResults: function (data) {
                        return data;
                    },
                    cache: true
                }
            });

            $staff.on('change', toggleAllFilters);
            toggleAllFilters();
        })();
    </script>
@endsection