@extends('layouts.main')

@section('breadcrumbs')
    {{ Breadcrumbs::render(request()->route()->getName()) }}
@endsection

@section('content')
    @push('style')
        <style>
            .add-new-bg {
                background-image: url('/assets/media/images/2600x1200/bg-4.png');
            }

            .dark .add-new-bg {
                background-image: url('/assets/media/images/2600x1200/bg-4-dark.png');
            }
        </style>
    @endpush
    @include('lpj::assetsku.includenya')
    <div class="grid gap-5 mx-auto w-full lg:gap-7.5">
        @include('lpj::component.detail-jaminan',['backLink'=>'surveyor.index'])

        @if ($permohonan->status == 'revisi-survey')
            <div class="min-w-full border card border-agi-100">
                <div class="card-header light:bg-agi-50" id="basic_settings">
                    <div class="flex flex-row gap-1.5 card-title">
                    Catatan Revisi
                    </div>
                </div>
                <div class="card-body">
                    <p>{{ $permohonan->keterangan ?? '' }}</p>
                </div>
            </div>
        @endif

        <div class="min-w-full border card border-agi-100">
            <div class="card-header light:bg-agi-50" id="basic_settings">
                <div class="flex flex-row gap-1.5 card-title">
                   Form Jaminan
                </div>
            </div>

            <div class="card-body">
                @include('lpj::surveyor.components.card-tambah')
            </div>

            <div class="card-footer">
                <div class="flex gap-5">
                    <button type="button" id="btnSubmit" class="btn btn-primary">
                        Submit
                    </button>
                </div>
            </div>

        </div>
    </div>
@endsection

@push('scripts')
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            checkButtonStatus();
            document.getElementById('btnSubmit').addEventListener('click', onSubmit);
        });

        function checkButtonStatus() {
            $.ajax({
                url: "{{ route('surveyor.checkButtonStatus', ['id' => $surveyor]) }}",
                type: "GET",
                headers: {
                    'X-CSRF-TOKEN': '{{ csrf_token() }}'
                },
                success: function(response) {
                    if (response.buttonDisable) {
                        $('#btnProses, #btnSubmit').prop('disabled', true);
                    } else {
                        $('#btnProses, #btnSubmit').prop('disabled', false);
                    }
                },
                error: function(xhr, status, error) {
                    console.log('Error checking button status:', error, status, xhr);
                }
            });
        }

        function onProses() {
            return alert('Are you sure you want to submit?');
        }

        function onSubmit() {
            $.ajax({
                url: "{{ route('surveyor.submitSurveyor', ['id' => $surveyor]) }}",
                type: "POST",
                headers: {
                    'X-CSRF-TOKEN': '{{ csrf_token() }}'
                },
                success: function(response) {
                    if (response.success) {
                        window.location.href = "{{ route('surveyor.index') }}";
                        toastrSuccessBuild(response.message);
                    }
                },
                error: function(xhr, status, error) {
                    if (xhr.responseJSON.message) {
                        toastrErrorBuild(xhr.responseJSON.message);
                    }else{
                        toastrErrorBuild('Terjadi kesalahan');
                    }
                }
            });
        }
    </script>
@endpush
