lpj/resources/views/surveyor/components/inspeksi.blade.php

@extends('layouts.main')

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

@section('content')
    <div class="w-full grid gap-5 lg:gap-7.5 mx-auto">
        <div class="card min-w-full">
            <div class="card min-w-full">
                <div class="card-header">
                    <h3 class="card-title">
                        Form Inspeksi
                    </h3>
                    <div class="flex items-center gap-2">
                        <a href="{{ route('surveyor.show', ['id' => request('inspeksi')]) }}?form=inspeksi"
                            class="btn btn-xs btn-info">
                            <i class="ki-filled ki-exit-left"></i> Back
                        </a>
                    </div>
                </div>
            </div>
        </div>



        {{-- <div class="card">
            <div class="card-body"> --}}
        <form id="formInspeksi" method="POST" enctype="multipart/form-data" class="grid gap-5">
            @csrf

            <input type="hidden" name="permohonan_id" value="{{ $permohonan->id }}">
            <input type="text
            " name="jenis_jaminan_id" value="{{ request('jenis_jaminan') }}">


            @foreach ($permohonan->debiture->documents as $dokumen)
            @if ($dokumen->jenisJaminan)
                @php
                    $formKategori = json_decode($dokumen->jenisJaminan->form_kategori, true);
                @endphp
                @if (isset($formKategori) && $formKategori)
                    <input type="hidden" name="action"
                        value="{{ is_array($formKategori) ? implode(',', $formKategori) : $formKategori }}">
                    <input type="hidden" name="type"
                        value="{{ is_array($formKategori) ? implode(',', $formKategori) : $formKategori }}">
                    @if (is_array($formKategori))
                        @foreach ($formKategori as $kategori)
                            @include('lpj::surveyor.components.' . str_replace('-', '-', $kategori), [
                                'dokumen' => $dokumen,
                            ])
                        @endforeach
                    @endif
                @endif
            @endif
        @endforeach

            <div class="flex justify-end gap-2" style="margin-right: 20px; margin-top: 20px">
                <button type="button" class="btn btn-success" id="saveButton" onclick="submitData()">
                    <span id="saveButtonText">Save</span>
                    <div class="spinner-border spinner-border-sm text-light" role="status" style="display: none;"
                        id="saveButtonSpinner">
                        <span class="visually-hidden">Loading...</span>
                    </div>
                </button>
            </div>
        </form>
        {{-- </div>
        </div> --}}
    </div>
@endsection
@push('scripts')
    <script>
        // Fungsi untuk mengambil lokasi pengguna
        function getUserLocation() {
            if (navigator.geolocation) {
                navigator.geolocation.getCurrentPosition(showPosition, showError);
            } else {
                alert("Geolocation tidak didukung oleh browser ini.");
            }
        }

        // Fungsi untuk menampilkan posisi
        function showPosition(position) {
            var lat = position.coords.latitude;
            var lng = position.coords.longitude;
            document.getElementById('lat').value = lat;
            document.getElementById('lng').value = lng;
            var mapUrl = `https://www.google.com/maps?q=${lat},${lng}&z=15&output=embed`;
            document.getElementById('mapFrame').src = mapUrl;
        }

        // Fungsi untuk menangani error jika lokasi tidak bisa diambil
        function showError(error) {
            switch (error.code) {
                case error.PERMISSION_DENIED:
                    alert("Pengguna menolak permintaan geolokasi.");
                    break;
                case error.POSITION_UNAVAILABLE:
                    alert("Informasi lokasi tidak tersedia.");
                    break;
                case error.TIMEOUT:
                    alert("Permintaan lokasi pengguna berakhir.");
                    break;
                case error.UNKNOWN_ERROR:
                    alert("Terjadi kesalahan yang tidak diketahui.");
                    break;
            }
        }
        window.onload = getUserLocation;
    </script>


    <script type="text/javascript">
        function toggleTidakSesuai(field, inputId) {
            const selectedValue = $(`[name="${field}"]:checked, [name="${field}"]:checked`).val();
            const inputField = $(`#${inputId}`);

            if (selectedValue === 'tidak sesuai' || selectedValue === 'lainnya') {
                inputField.show();
            } else {
                inputField.hide().val('');
            }
        }

        function submitData() {
            const formElement = $('#formInspeksi')[0];
            const formData = new FormData(formElement);

            // Disable the button and show the spinner
            $('#saveButton').prop('disabled', true);
            $('#saveButtonText').hide();
            $('#saveButtonSpinner').show();

            $.ajax({
                url: '{{ route('surveyor.store') }}',
                type: 'POST',
                data: formData,
                processData: false,
                contentType: false,
                headers: {
                    'X-CSRF-TOKEN': '{{ csrf_token() }}'
                },
                success: function(response) {
                    if (response.success) {
                        window.location.href =
                            '{{ route('surveyor.show', ['id' => $permohonan->id]) }}?form=inspeksi';
                    }
                    console.log(response);
                },
                error: function(xhr, status, error) {
                    let errors = xhr.responseJSON?.errors;
                    $('.alert').text('');
                    if (errors) {
                        $.each(errors, function(key, value) {
                            $(`#error-${key}`).text(value[0]);
                        });
                    }
                    console.error('Terjadi error:', error); // Menampilkan pesan error di konsol
                    console.log('Status:', status);
                    console.log('Response:', xhr.responseText);
                    console.log(errors);
                },
                complete: function() {
                    // Re-enable the button and hide the spinner
                    $('#saveButton').prop('disabled', false);
                    $('#saveButtonText').show();
                    $('#saveButtonSpinner').hide();
                }
            });
        }
    </script>
@endpush