@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

    <div class="w-full grid gap-5 lg:gap-7.5 mx-auto">


        @include('lpj::component.detail-jaminan',['backLink'=>'surveyor.index'])

        <div class="card min-w-full py-2 px-2">
            <div class="card-header" id="basic_settings">
                <div class="card-title flex flex-row gap-1.5">
                   Form Jaminan
                </div>
            </div>

            <div class="card-body">
                @if (request()->has('form') && request('form') == 'denah')
                    @include('lpj::surveyor.components.card-tambah')
                    @elseif(request()->has('form') && request('form') == 'data-pembanding')
                    @include('lpj::surveyor.components.card-tambah')
                @elseif(request()->has('form') && request('form') == 'foto')
                    @include('lpj::surveyor.components.card-tambah')
                @else
                    @include('lpj::surveyor.components.card-tambah')
                @endIf
            </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') }}";
                    }
                },
                error: function(xhr, status, error) {
                    console.log('Error checking button status:', error, status, xhr);
                }
            });
        }




        $('.card-title a').on('click', function(e) {
            e.preventDefault();
            var url = $(this).attr('href');

            $.get(url, function(response) {
                $('.card-body').html(response);
            });
        });
    </script>
@endpush