@extends('layouts.app')

@section('title', 'Verify Lead')

@section('css')
<!-- Select2 CSS -->
<link href="{{ asset('build/libs/select2/css/select2.min.css') }}" rel="stylesheet" type="text/css" />
@endsection

@section('content')

@component('components.breadcrumb')
@slot('li_1') Lead Applications @endslot
@slot('title') Verify Lead @endslot
@endcomponent

<!-- Alert Messages -->
@if (session('success'))
<div class="alert alert-success alert-dismissible fade show" role="alert">
    <i class="mdi mdi-check-all me-2"></i> {{ session('success') }}
    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
@endif

@if (session('error'))
<div class="alert alert-danger alert-dismissible fade show" role="alert">
    <i class="mdi mdi-alert-circle-outline me-2"></i> {{ session('error') }}
    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
@endif

<div class="row">
    <div class="col-lg-12">
        <div class="card">
            <div class="card-body">
                <h4 class="card-title">Lead Information</h4>
                <p class="card-title-desc">Verify lead details below.</p>

                <form action="{{ route('lead.verify', ['id' => Crypt::encryptString($lead->id)]) }}" method="POST">
                    @csrf

                    <div class="row">
                        {{-- Title Summary --}}
                        <div class="col-md-12 mb-3">
                            <label class="form-label">Title Summary</label>
                            <textarea class="form-control" name="title_summary" readonly>{{ $lead->title_summary }}</textarea>
                        </div>

                        {{-- Verification Status --}}
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Verification Status</label>
                            <select class="form-select select2" name="lead_status" required>
                                <option value="verified" {{ $lead->status == 'verified' ? 'selected' : '' }}>Verified</option>
                                <option value="pending" {{ $lead->status == 'pending' ? 'selected' : '' }}>Pending</option>
                                <option value="rejected" {{ $lead->status == 'rejected' ? 'selected' : '' }}>Rejected</option>
                            </select>
                        </div>

                        {{-- Rejection Note --}}
                        <div class="col-md-6 mb-3 rejection-note" style="display: none;">
                            <label class="form-label">Rejection Note</label>
                            <textarea class="form-control" name="rejection_note">{{ $lead->rejection_note }}</textarea>
                        </div>

                    </div>

                    <button type="submit" class="btn btn-primary w-md">
                        <i class="bx bxs-save"></i> Save Verification
                    </button>
                </form>

            </div>
        </div>
    </div>

    {{-- Loop Through Documents --}}
    @foreach($leadDocuments as $document)
    <div class="col-lg-12">
        <div class="card mt-2">
            <div class="card-body">
                <h4 class="card-title">Document Verification - {{ $document->docType->description }}</h4>

                <form action="{{ route('lead.document.verify', ['id' => $document->id]) }}" method="POST">
                    @csrf
                    <div class="row">
                        {{-- Document Reference --}}
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Reference</label>
                            <input type="text" class="form-control" value="{{ $document->reference }}" readonly>
                        </div>

                        {{-- Status --}}
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Verification Status</label>
                            <select class="form-select select2 verify-status" name="document_status">
                                <option value="verified" {{ $document->status == 'verified' ? 'selected' : '' }}>Verified</option>
                                <option value="pending" {{ $document->status == 'pending' ? 'selected' : '' }}>Pending</option>
                                <option value="rejected" {{ $document->status == 'rejected' ? 'selected' : '' }}>Rejected</option>
                            </select>
                        </div>

                        {{-- Rejection Note --}}
                        <div class="col-md-6 mb-3 rejection-note" style="display: none;">
                            <label class="form-label">Rejection Note</label>
                            <textarea class="form-control" name="document_rejection_note">{{ $document->rejection_note }}</textarea>
                        </div>

                    </div>

                    <button type="submit" class="btn btn-primary">
                        <i class="bx bxs-save"></i> Save Verification
                    </button>
                </form>
            </div>
        </div>
    </div>
    @endforeach
</div>

@endsection

@section('script')
<script>
    $(document).ready(function() {
        $('.select2').select2();

        $(".verify-status").change(function() {
            let selectedStatus = $(this).val();
            let rejectionField = $(this).closest(".row").find(".rejection-note");

            if (selectedStatus === "rejected") {
                rejectionField.show();
            } else {
                rejectionField.hide();
            }
        });
    });

</script>
@endsection