@extends('layouts.app')

@section('title', 'Physical Product Units & QR Registry')

@section('content')
<div class="d-flex flex-wrap justify-content-between align-items-center mb-4 gap-3">
    <div>
        <h3 class="fw-bold mb-1 text-dark">Individual Product Units & QR Registry</h3>
        <p class="text-muted mb-0 small">Every physical manufactured unit has a dedicated database identity, sequential serial number, and cryptographic QR token.</p>
    </div>

    <a href="{{ route('manufacturing.verify.form') }}" class="btn btn-agri">
        <i class="bi bi-upc-scan me-1"></i> QA Unit Verification Terminal
    </a>
</div>

<!-- Search & Filter Card -->
<div class="card shadow-sm border-0 mb-4">
    <div class="card-body p-3">
        <form method="GET" action="{{ route('manufacturing.units.index') }}" class="row g-2 align-items-center">
            <div class="col-md-4 col-lg-4">
                <div class="input-group">
                    <span class="input-group-text bg-light text-muted"><i class="bi bi-search"></i></span>
                    <input type="text" class="form-control" name="search" value="{{ $searchTerm }}" placeholder="Scan or search serial number, unit ID, QR token...">
                </div>
            </div>

            <div class="col-md-3 col-lg-3">
                <select class="form-select" name="batch_id">
                    <option value="">All Batches</option>
                    @foreach($batches as $b)
                        <option value="{{ $b->id }}" {{ $batchId == $b->id ? 'selected' : '' }}>
                            {{ $b->batch_number }} ({{ $b->product->name }})
                        </option>
                    @endforeach
                </select>
            </div>

            <div class="col-md-2 col-lg-2">
                <select class="form-select" name="status">
                    <option value="">All Statuses</option>
                    @foreach($statuses as $st)
                        <option value="{{ $st }}" {{ $statusFilter === $st ? 'selected' : '' }}>
                            {{ $st }}
                        </option>
                    @endforeach
                </select>
            </div>

            <div class="col-md-2 col-lg-2">
                <select class="form-select" name="verification_status">
                    <option value="">All Verification</option>
                    <option value="verified" {{ $verifFilter === 'verified' ? 'selected' : '' }}>Verified Only</option>
                    <option value="unverified" {{ $verifFilter === 'unverified' ? 'selected' : '' }}>Unverified Only</option>
                    <option value="failed" {{ $verifFilter === 'failed' ? 'selected' : '' }}>Failed / Rejected</option>
                </select>
            </div>

            <div class="col-md-1 col-lg-1 d-flex gap-1">
                <button type="submit" class="btn btn-agri w-100" title="Apply Filters">
                    <i class="bi bi-funnel"></i>
                </button>
                @if($searchTerm || $batchId || $statusFilter || $verifFilter)
                    <a href="{{ route('manufacturing.units.index') }}" class="btn btn-light border" title="Reset Filters">
                        <i class="bi bi-x-lg"></i>
                    </a>
                @endif
            </div>
        </form>
    </div>
</div>

<!-- Units Table -->
<div class="card shadow-sm border-0 mb-4">
    <div class="table-responsive">
        <table class="table table-hover align-middle mb-0">
            <thead>
                <tr>
                    <th>Serial Number</th>
                    <th>Product & SKU</th>
                    <th>Batch</th>
                    <th>Dates (Mfg / Exp)</th>
                    <th>Lifecycle Status</th>
                    <th>Verification</th>
                    <th>Prints</th>
                    <th class="text-end">Actions</th>
                </tr>
            </thead>
            <tbody>
                @forelse($units as $unit)
                    <tr>
                        <td>
                            <a href="{{ route('manufacturing.units.show', $unit) }}" class="fw-bold font-monospace text-dark text-decoration-none">
                                {{ $unit->serial_number }}
                            </a>
                            <small class="text-muted d-block font-monospace">{{ $unit->unit_id }}</small>
                        </td>
                        <td>
                            <div class="fw-semibold text-dark">{{ $unit->product->name }}</div>
                            <small class="text-muted">{{ $unit->product->size_or_weight ?? 'Standard' }} ({{ $unit->product->unit_of_measurement }})</small>
                        </td>
                        <td>
                            <a href="{{ route('manufacturing.batches.show', $unit->batch) }}" class="badge bg-light text-dark border font-monospace text-decoration-none">
                                {{ $unit->batch->batch_number }}
                            </a>
                        </td>
                        <td>
                            <div class="small">Mfg: {{ $unit->manufacturing_date->format('d/m/Y') }}</div>
                            <small class="text-muted">Exp: {{ $unit->expiry_date->format('d/m/Y') }}</small>
                        </td>
                        <td>
                            @if($unit->status === 'Verified' || $unit->status === 'Ready for Warehouse')
                                <span class="badge bg-success-subtle text-success border">{{ $unit->status }}</span>
                            @elseif($unit->status === 'Awaiting Verification' || $unit->status === 'Generated')
                                <span class="badge bg-info-subtle text-info-emphasis border">{{ $unit->status }}</span>
                            @elseif($unit->status === 'Quarantined' || $unit->status === 'Damaged' || $unit->status === 'Cancelled')
                                <span class="badge bg-danger-subtle text-danger border">{{ $unit->status }}</span>
                            @else
                                <span class="badge bg-light text-dark border">{{ $unit->status }}</span>
                            @endif
                        </td>
                        <td>
                            @if($unit->isVerified())
                                <span class="badge badge-active"><i class="bi bi-check-circle me-1"></i>Verified</span>
                            @else
                                <span class="badge bg-secondary-subtle text-secondary">Unverified</span>
                            @endif
                        </td>
                        <td>
                            <span class="badge bg-light text-dark border">{{ $unit->print_count }}x</span>
                        </td>
                        <td class="text-end">
                            <a href="{{ route('manufacturing.units.show', $unit) }}" class="btn btn-sm btn-light border" title="Inspect Unit & QR">
                                <i class="bi bi-eye"></i>
                            </a>
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="8" class="text-center py-5 text-muted">
                            <i class="bi bi-qr-code text-muted" style="font-size: 2.5rem;"></i>
                            <h5 class="text-muted mt-2">No product units found</h5>
                            <p class="text-muted small">No units match your filter criteria or none have been generated yet.</p>
                        </td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </div>

    @if($units->hasPages())
        <div class="p-3 border-top">
            {{ $units->links('pagination::bootstrap-5') }}
        </div>
    @endif
</div>
@endsection