@extends('layouts.app', ['title' => 'Admin Documents | Print Cards'])

@section('content')
    <div class="d-flex justify-content-between align-items-center mb-4">
        <div>
            <h1 class="h3 mb-1">Upload Approval</h1>
            <p class="text-muted mb-0">Approve or reject uploaded customer files before production.</p>
        </div>
        <a href="{{ route('admin.dashboard') }}" class="btn btn-outline-secondary">Back to Dashboard</a>
    </div>

    <div class="card card-soft mb-4">
        <div class="card-body">
            <form method="GET" class="row g-3">
                <div class="col-md-4">
                    <label class="form-label">Approval Status</label>
                    <select name="status" class="form-select">
                        <option value="">All</option>
                        <option value="pending" @selected($selectedStatus === 'pending')>Pending</option>
                        <option value="approved" @selected($selectedStatus === 'approved')>Approved</option>
                        <option value="rejected" @selected($selectedStatus === 'rejected')>Rejected</option>
                    </select>
                </div>
                <div class="col-md-2 d-grid align-items-end">
                    <button class="btn btn-primary mt-md-4" type="submit">Apply</button>
                </div>
            </form>
        </div>
    </div>

    <div class="card card-soft">
        <div class="card-body">
            <div class="table-responsive">
                <table class="table align-middle">
                    <thead>
                        <tr>
                            <th>Document</th>
                            <th>User</th>
                            <th>Status</th>
                            <th>Reason</th>
                            <th>Action</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($documents as $document)
                            <tr>
                                <td>
                                    <div class="fw-semibold">{{ $document->title }}</div>
                                    <div class="small text-muted">{{ $document->document_number }} | {{ $document->original_name }}</div>
                                </td>
                                <td>{{ $document->user?->name }}</td>
                                <td>{{ ucfirst($document->approval_status) }}</td>
                                <td>{{ $document->rejection_reason ?: '-' }}</td>
                                <td>
                                    <form method="POST" action="{{ route('admin.documents.update', $document) }}" class="row g-2">
                                        @csrf
                                        @method('PATCH')
                                        <div class="col-12">
                                            <select name="approval_status" class="form-select form-select-sm">
                                                <option value="pending" @selected($document->approval_status === 'pending')>Pending</option>
                                                <option value="approved" @selected($document->approval_status === 'approved')>Approved</option>
                                                <option value="rejected" @selected($document->approval_status === 'rejected')>Rejected</option>
                                            </select>
                                        </div>
                                        <div class="col-12">
                                            <input type="text" name="rejection_reason" class="form-control form-control-sm" placeholder="Reason if rejected" value="{{ $document->rejection_reason }}">
                                        </div>
                                        <div class="col-12 d-grid">
                                            <button class="btn btn-sm btn-primary" type="submit">Save</button>
                                        </div>
                                    </form>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>
    </div>
@endsection