{{-- Display all unique awarder names as "a, b, c, and d" --}}
@php
$awarderNames = $lead->contracts->pluck('awarder_name')->filter()->unique()->values();
$awarderCount = $awarderNames->count();
@endphp

@extends('layouts.app')

@section('title')
Credit Committee Approval
@endsection

@section('css')
<!-- Sweet Alert-->
<link href="{{ URL::asset('build/libs/sweetalert2/sweetalert2.min.css') }}" rel="stylesheet" type="text/css" />
@endsection

@section('content')

@component('components.breadcrumb')
@slot('li_1') Credit Paper @endslot
@slot('title') {{ $lead->serial_no }} @endslot
@endcomponent

<div class="row">
    <div class="col-lg-12">
        <div class="card">
            <div class="card-body">
                <h4 class="card-title mb-0">Credit Committee Approval - {{ $lead->serial_no }}</h4>
                <p class="card-title-desc"> Please review the application details below.</p>

                @if (session('success'))
                <div class="alert alert-success alert-dismissible fade show" role="alert">
                    {{ session('success') }}
                    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
                </div>
                @endif
                @if (session('error'))
                <div class="alert alert-danger alert-dismissible fade show" role="alert">
                    {{ session('error') }}
                    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
                </div>
                @endif

                @if(!empty($lead->cc_reject_remarks))
                <div class="alert alert-danger">
                    <i class="mdi mdi-alert-circle-outline"></i>
                    <strong>Reject Notes:</strong><br>
                    {{ $lead->cc_reject_remarks }}
                </div>
                @endif

                <h5>View Related Document</h5>
                @include('components.forms.related-documents', [
                    'application_form' => true,
                    'term_sheet' => true,
                    'credit_paper' => true,
                ])

                <div class="verify-section-header mt-3" id="section-ccapproval">
                    <div class="card border-1 border-bottom-0 border-dark bg-dark rounded-0 p-1 mb-0">
                        <h5 class="card-title text-center m-0 fs-6 text-white">CREDIT COMMITTEE APPROVAL</h5>
                    </div>
                    <div class="card border-1 border-dark rounded-0 p-3 mb-0">
                        @if(!empty($lead->cc_verify_status_1))
                        <div class="bg-light p-3 mb-3">
                            <div class="row">
                                <h6 class="fw-bold">First Approval</h6>
                                <div class="col-lg-6">
                                    <span class="text-dark fw-bold">Approved By:</span>
                                    <span>{{ $lead->cc_verify_by_1 ?? '-' }}</span>
                                </div>
                                <div class="col-lg-6">
                                    <span class="text-dark fw-bold">Date/Time:</span>
                                    <span>{{ $lead->cc_verify_at_1 ? \Carbon\Carbon::parse($lead->cc_verify_at_1)->format('d/m/Y h:i A') : '-' }}</span>
                                </div>
                            </div>
                        </div>
                        @endif

                        @if(!empty($lead->cc_verify_status_2))
                        <div class="bg-light p-3">
                            <div class="row">
                                <h6 class="fw-bold">Second Approval</h6>
                                <div class="col-lg-6">
                                    <span class="text-dark fw-bold">Approved By:</span>
                                    <span>{{ $lead->cc_verify_by_2 ?? '-' }}</span>
                                </div>
                                <div class="col-lg-6">
                                    <span class="text-dark fw-bold">Date/Time:</span>
                                    <span>{{ $lead->cc_verify_at_2 ? \Carbon\Carbon::parse($lead->cc_verify_at_2)->format('d/m/Y h:i A') : '-' }}</span>
                                </div>
                            </div>
                        </div>
                        @else
                        <div class="mt-3">
                            @if(!empty($lead->cc_verify_status_1))
                            <p class="text-warning mb-2">First approval recorded. A second reviewer must accept before this lead can proceed.</p>
                            @endif
                            <button type="button" class="btn btn-success" onclick="approveCC()">Approve</button>
                            <button type="button" class="btn btn-danger ms-2" onclick="rejectCC()">Reject</button>
                        </div>
                        @endif
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

@endsection

@section('script')
<!-- Sweet Alerts js -->
<script src="{{ URL::asset('build/libs/sweetalert2/sweetalert2.min.js') }}"></script>
<script src="{{ URL::asset('build/js/pages/sweet-alerts.init.js') }}"></script>
<!-- form repeater js -->
<script src="{{ URL::asset('build/libs/jquery.repeater/jquery.repeater.min.js') }}"></script>
<script src="{{ URL::asset('build/js/pages/form-repeater.int.js') }}"></script>
<script>
    function approveCC() {
        Swal.fire({
            title: 'Approval Confirmation'
            , html: `
                <div style="text-align: left; margin: 20px 0;">
                    <p style="margin-bottom: 15px; font-weight: bold; color: #333;">Please confirm the following before proceeding with approval:</p>

                    <div style="margin-bottom: 12px;">
                        <label style="display: flex; align-items: flex-start; cursor: pointer;">
                            <input type="checkbox" id="swal-confirmReview" style="margin-right: 10px; margin-top: 3px;">
                            <span style="font-size: 14px;">I have thoroughly reviewed all credit application details, financial information, and supporting documents</span>
                        </label>
                    </div>

                    <div style="margin-bottom: 12px;">
                        <label style="display: flex; align-items: flex-start; cursor: pointer;">
                            <input type="checkbox" id="swal-confirmRisk" style="margin-right: 10px; margin-top: 3px;">
                            <span style="font-size: 14px;">I have assessed the risk factors and business viability of this application</span>
                        </label>
                    </div>

                    <div style="margin-bottom: 12px;">
                        <label style="display: flex; align-items: flex-start; cursor: pointer;">
                            <input type="checkbox" id="swal-confirmCompliance" style="margin-right: 10px; margin-top: 3px;">
                            <span style="font-size: 14px;">I confirm that this application meets our credit policy and compliance requirements</span>
                        </label>
                    </div>

                    <div style="margin-bottom: 12px;">
                        <label style="display: flex; align-items: flex-start; cursor: pointer;">
                            <input type="checkbox" id="swal-confirmAuthority" style="margin-right: 10px; margin-top: 3px;">
                            <span style="font-size: 14px;">I have the authority to approve this credit application and take full responsibility for this decision</span>
                        </label>
                    </div>
                </div>
            `
            , icon: 'question'
            , showCancelButton: true
            , confirmButtonColor: '#28a745'
            , cancelButtonColor: '#6c757d'
            , confirmButtonText: 'Proceed with Approval'
            , cancelButtonText: 'Cancel'
            , preConfirm: () => {
                const confirmReview = document.getElementById('swal-confirmReview').checked;
                const confirmRisk = document.getElementById('swal-confirmRisk').checked;
                const confirmCompliance = document.getElementById('swal-confirmCompliance').checked;
                const confirmAuthority = document.getElementById('swal-confirmAuthority').checked;

                if (!confirmReview || !confirmRisk || !confirmCompliance || !confirmAuthority) {
                    Swal.showValidationMessage('Please check all confirmation boxes before proceeding.');
                    return false;
                }
                return true;
            }
        }).then((result) => {
            if (result.isConfirmed) {
                Swal.fire({
                    title: 'Final Confirmation'
                    , text: 'This will submit the approval for verification by two reviewers before the lead can proceed. Continue?'
                    , icon: 'warning'
                    , showCancelButton: true
                    , confirmButtonColor: '#28a745'
                    , cancelButtonColor: '#6c757d'
                    , confirmButtonText: 'Yes, Submit'
                    , cancelButtonText: 'Cancel'
                }).then((finalResult) => {
                    if (finalResult.isConfirmed) {
                        var form = document.createElement('form');
                        form.method = 'POST';
                        form.action = "{{ route('approvalcc.approve', $lead->serial_no) }}";
                        form.style.display = 'none';

                        var csrf = document.createElement('input');
                        csrf.type = 'hidden';
                        csrf.name = '_token';
                        csrf.value = "{{ csrf_token() }}";
                        form.appendChild(csrf);

                        document.body.appendChild(form);
                        form.submit();
                    }
                });
            }
        });
    }

    function rejectCC() {
        Swal.fire({
            title: 'Reject Lead'
            , html: `
                <div style="text-align: left; margin: 10px 0;">
                    <label style="font-weight: bold; display: block; margin-bottom: 5px;">Send back to:</label>
                    <select id="swal-destination" class="swal2-select" style="width: 100%; margin: 0 0 15px 0;">
                        <option value="credit_paper">Credit Paper Preparation</option>
                        <option value="recommendation">Head of Credit &amp; Risk's Recommendation</option>
                    </select>
                    <label style="font-weight: bold; display: block; margin-bottom: 5px;">Remarks:</label>
                    <textarea id="swal-remarks" class="swal2-textarea" style="width: 100%; margin: 0;" placeholder="Enter remarks for rejection..." aria-label="Enter remarks for rejection"></textarea>
                </div>
            `
            , showCancelButton: true
            , confirmButtonText: 'Reject'
            , confirmButtonColor: '#d33'
            , preConfirm: () => {
                const destination = document.getElementById('swal-destination').value;
                const remarks = document.getElementById('swal-remarks').value;
                if (!remarks) {
                    Swal.showValidationMessage('Remarks are required!');
                    return false;
                }
                return { destination, remarks };
            }
        }).then((result) => {
            if (result.isConfirmed && result.value) {
                var form = document.createElement('form');
                form.method = 'POST';
                form.action = "{{ route('approvalcc.reject', $lead->serial_no) }}";
                form.style.display = 'none';

                var csrf = document.createElement('input');
                csrf.type = 'hidden';
                csrf.name = '_token';
                csrf.value = "{{ csrf_token() }}";
                form.appendChild(csrf);

                var destInput = document.createElement('input');
                destInput.type = 'hidden';
                destInput.name = 'destination';
                destInput.value = result.value.destination;
                form.appendChild(destInput);

                var remarksInput = document.createElement('input');
                remarksInput.type = 'hidden';
                remarksInput.name = 'remarks';
                remarksInput.value = result.value.remarks;
                form.appendChild(remarksInput);

                document.body.appendChild(form);
                form.submit();
            }
        });
    }
</script>
@endsection