daengdeni/lpj
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update form foto inspeksi

Browse Source
This commit is contained in:
majid
2024-11-12 17:40:46 +07:00
parent d0390d3f9f
commit edf293b203
11 changed files with 1093 additions and 967 deletions
Download Patch File Download Diff File Expand all files Collapse all files

148
resources/views/surveyor/components/inspeksi.blade.php
View File

@@ -201,81 +201,20 @@
@include('lpj::surveyor.components.fakta')
<div class="flex justify-end gap-2" style="margin-right: 20px; margin-top: 20px">
<button type="button" class="btn btn-success" onclick="submitData()">
Save
</button>
<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>
<div class="modal fade" data-modal="true" id="modal" data-backdrop="static" data-keyboard="false">
<div class="modal-content">
<div class="modal-header">
<h3 class="modal-title">Kunjungan</h3>
<button class="btn btn-xs btn-icon btn-light" data-modal-dismiss="true">
<i class="ki-outline ki-cross"></i>
</button>
</div>
<div class="modal-body" id="screenshotContainer" style="height: 500px">
<iframe id="mapFrameGis" style="width: 100%; height: 100%;"></iframe>
</div>
<div class="modal-footer flex justify-end">
<button id="takeScreenshot" class="btn btn-success">Take Screenshot</button>
</div>
</div>
</div>
@endsection
@push('scripts')
<script>
function getMap(params) {
const iframe = document.getElementById('mapFrameGis');
const maps = [
'https://gistaru.atrbpn.go.id/rtronline/',
'https://bhumi.atrbpn.go.id/peta'
];
iframe.src = maps[params];
}
function openModal(type) {
const modalGistaru = document.getElementById('gistaru');
const modalBumi = document.getElementById('bumi');
if (type === 'bumi') {
modalBumi.setAttribute('data-modal-toggle', '#modal');
} else if (type === 'gistaru') {
modalGistaru.setAttribute('data-modal-toggle', '#modal');
}
getMap(type === 'gistaru' ? 0 : 1);
}
document.getElementById('takeScreenshot').addEventListener('click', () => {
const screenshotContainer = document.getElementById('screenshotContainer');
const canvas = document.createElement('canvas');
canvas.width = screenshotContainer.offsetWidth;
canvas.height = screenshotContainer.offsetHeight;
const ctx = canvas.getContext('2d');
ctx.drawImage(document.getElementById('mapFrame'), 0, 0, canvas.width, canvas.height);
const dataURL = canvas.toDataURL('image/jpeg');
// Tampilkan gambar di atas input
const inputRute = document.getElementById('inputRute');
const img = document.createElement('img');
img.src = dataURL;
img.style.maxWidth = '100%';
img.style.maxHeight = '200px';
inputRute.parentNode.insertBefore(img, inputRute);
// Isi input dengan data URL gambar
inputRute.value = dataURL;
});
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
<script>
// Fungsi untuk mengambil lokasi pengguna
function getUserLocation() {
@@ -330,41 +269,50 @@
}
function submitData() {
const formElement = $('#formInspeksi')[0];
const formData = new FormData(formElement);
const formElement = $('#formInspeksi')[0];
const formData = new FormData(formElement);
$.ajax({
url: '{{ route('surveyor.store') }}',
type: 'POST',
data: formData,
processData: false,
contentType: false,
headers: {
'X-CSRF-TOKEN': '{{ csrf_token() }}'
},
success: function(response) {
// Pastikan respons dari server memiliki atribut 'success'
if (response.success) {
window.location.href =
'{{ route('surveyor.show', ['id' => $permohonan->id]) }}?form=inspeksi';
}
console.log(response);
},
error: function(xhr, status, error) { // Menghapus tanda kurung ganda
let errors = xhr.responseJSON?.errors; // Pastikan xhr.responseJSON ada sebelum akses errors
// Disable the button and show the spinner
$('#saveButton').prop('disabled', true);
$('#saveButtonText').hide();
$('#saveButtonSpinner').show();
$('.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);
$.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