fix(suveyor/penilai/so): perbaikan print out, form survey dan laporan dan paparan
This commit is contained in:
majid
@@ -271,264 +271,279 @@
|
||||
<script>
|
||||
let jsonDataContoh = @json($formFoto);
|
||||
Dropzone.autoDiscover = false;
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
let myDropzone = null;
|
||||
let uploadQueue = 0;
|
||||
let uploadBatch = [];
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
let myDropzone = null;
|
||||
let uploadQueue = 0;
|
||||
let uploadBatch = [];
|
||||
|
||||
function initDropzone(selector, paramName) {
|
||||
try {
|
||||
const dropzoneElement = document.querySelector(selector);
|
||||
if (!dropzoneElement) {
|
||||
console.error(`Dropzone element not found: ${selector}`);
|
||||
return null;
|
||||
function initDropzone(selector, paramName) {
|
||||
try {
|
||||
const dropzoneElement = document.querySelector(selector);
|
||||
if (!dropzoneElement) {
|
||||
console.error(`Dropzone element not found: ${selector}`);
|
||||
return null;
|
||||
}
|
||||
const processedFiles = new Set();
|
||||
|
||||
// Track files that are already on the server
|
||||
const existingFiles = new Set();
|
||||
|
||||
myDropzone = new Dropzone(selector, {
|
||||
url: "{{ route('surveyor.storeFoto') }}",
|
||||
paramName: paramName,
|
||||
acceptedFiles: 'image/*',
|
||||
uploadMultiple: false,
|
||||
parallelUploads: 1,
|
||||
autoProcessQueue: true,
|
||||
dictDefaultMessage: 'Seret foto atau klik untuk unggah',
|
||||
|
||||
headers: {
|
||||
'X-CSRF-TOKEN': '{{ csrf_token() }}'
|
||||
},
|
||||
|
||||
params: {
|
||||
permohonan_id: {{ $permohonan->id ?? 0 }},
|
||||
dokument_id: '{{ request('dokument') ?? '' }}',
|
||||
param_name: paramName,
|
||||
nomor_registrasi: '{{ $permohonan->nomor_registrasi ?? '' }}',
|
||||
},
|
||||
|
||||
accept: function(file, done) {
|
||||
// Generate a unique identifier for the file - use hash or content-based ID if possible
|
||||
const fileId = file.name + '_' + file.size;
|
||||
|
||||
// If file is already being processed, reject it
|
||||
if (processedFiles.has(fileId)) {
|
||||
done('File sudah dalam antrian upload.');
|
||||
return;
|
||||
}
|
||||
const processedFiles = new Set();
|
||||
|
||||
myDropzone = new Dropzone(selector, {
|
||||
url: "{{ route('surveyor.storeFoto') }}",
|
||||
paramName: paramName,
|
||||
acceptedFiles: 'image/*',
|
||||
uploadMultiple: false,
|
||||
parallelUploads: 1,
|
||||
autoProcessQueue: true,
|
||||
dictDefaultMessage: 'Seret foto atau klik untuk unggah',
|
||||
// Check if file already exists on server
|
||||
if (existingFiles.has(file.name)) {
|
||||
done('File dengan nama ini sudah ada.');
|
||||
return;
|
||||
}
|
||||
|
||||
headers: {
|
||||
'X-CSRF-TOKEN': '{{ csrf_token() }}'
|
||||
},
|
||||
|
||||
params: {
|
||||
permohonan_id: {{ $permohonan->id ?? 0 }},
|
||||
dokument_id: '{{ request('dokument') ?? '' }}',
|
||||
param_name: paramName,
|
||||
nomor_registrasi: '{{ $permohonan->nomor_registrasi ?? '' }}',
|
||||
},
|
||||
accept: function(file, done) {
|
||||
// Generate a unique identifier for the file
|
||||
const fileId = file.name + '_' + file.size;
|
||||
|
||||
// If file is already being processed, reject it
|
||||
if (processedFiles.has(fileId)) {
|
||||
done('File sudah dalam antrian upload.');
|
||||
return;
|
||||
}
|
||||
|
||||
// Add file to processed set
|
||||
processedFiles.add(fileId);
|
||||
done();
|
||||
},
|
||||
|
||||
addedfiles: function(files) {
|
||||
const validFiles = Array.from(files).filter(file => {
|
||||
// Generate a unique ID for this file
|
||||
const fileId = file.name + '_' + file.size;
|
||||
|
||||
// Only count files that haven't been rejected
|
||||
return !file.rejected;
|
||||
});
|
||||
|
||||
uploadQueue += validFiles.length;
|
||||
uploadBatch = validFiles;
|
||||
|
||||
if (validFiles.length > 0) showLoadingOverlay();
|
||||
},
|
||||
error: function(file, response) {
|
||||
// Remove file from processed list on error
|
||||
const fileId = file.name + '_' + file.size;
|
||||
processedFiles.delete(fileId);
|
||||
|
||||
handleUploadComplete(file, false, response.message);
|
||||
},
|
||||
success: function(file, response) {
|
||||
if (response.success) {
|
||||
const fileData = {
|
||||
path: response.path || file.path,
|
||||
name: file.name,
|
||||
description: '',
|
||||
category: 'lainnya',
|
||||
sub: '',
|
||||
param_name: paramName
|
||||
};
|
||||
|
||||
addEditAndDeleteButtons(file, fileData);
|
||||
handleUploadComplete(file, true);
|
||||
} else {
|
||||
handleUploadComplete(file, false, response.message);
|
||||
}
|
||||
},
|
||||
|
||||
init: function() {
|
||||
const dz = this;
|
||||
|
||||
// Clear processed files when all uploads complete
|
||||
this.on("queuecomplete", function() {
|
||||
processedFiles.clear();
|
||||
});
|
||||
|
||||
// Load existing photos
|
||||
loadExistingPhotos(this, paramName);
|
||||
}
|
||||
// Add file to processed set
|
||||
processedFiles.add(fileId);
|
||||
done();
|
||||
},
|
||||
|
||||
addedfiles: function(files) {
|
||||
const validFiles = Array.from(files).filter(file => {
|
||||
// Only count files that haven't been rejected
|
||||
return !file.rejected;
|
||||
});
|
||||
|
||||
return myDropzone;
|
||||
} catch (error) {
|
||||
console.error('Dropzone initialization error:', error);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
uploadQueue += validFiles.length;
|
||||
uploadBatch = validFiles;
|
||||
|
||||
function loadExistingPhotos(dropzone, paramName) {
|
||||
showLoadingOverlay();
|
||||
if (validFiles.length > 0) showLoadingOverlay();
|
||||
},
|
||||
|
||||
$.ajax({
|
||||
url: "{{ route('surveyor.getFoto') }}",
|
||||
method: 'GET',
|
||||
data: {
|
||||
permohonan_id: {{ $permohonan->id ?? 0 }},
|
||||
dokument_id: '{{ request('dokument') ?? '' }}',
|
||||
param_name: paramName
|
||||
},
|
||||
headers: {
|
||||
'X-CSRF-TOKEN': '{{ csrf_token() }}'
|
||||
},
|
||||
success: function(response) {
|
||||
if (response.fotos && response.fotos.length) {
|
||||
response.fotos.forEach(function(foto) {
|
||||
var mockFile = {
|
||||
name: foto.name,
|
||||
size: foto.size || 12345,
|
||||
originalPath: foto.path
|
||||
};
|
||||
error: function(file, response) {
|
||||
// Remove file from processed list on error
|
||||
const fileId = file.name + '_' + file.size;
|
||||
processedFiles.delete(fileId);
|
||||
|
||||
dropzone.emit("addedfile", mockFile);
|
||||
dropzone.emit("thumbnail", mockFile, foto.path);
|
||||
dropzone.emit("complete", mockFile);
|
||||
addEditAndDeleteButtons(mockFile, {
|
||||
path: foto.path,
|
||||
name: foto.name,
|
||||
description: foto.description || '',
|
||||
category: foto.category || 'lainnya',
|
||||
sub: foto.sub || '',
|
||||
param_name: paramName
|
||||
});
|
||||
});
|
||||
}
|
||||
},
|
||||
error: function(xhr, status, error) {
|
||||
console.error('Gagal memuat foto:', error);
|
||||
showErrorMessage('Gagal memuat foto yang ada');
|
||||
},
|
||||
complete: function() {
|
||||
hideLoadingOverlay();
|
||||
}
|
||||
});
|
||||
}
|
||||
// Format error message
|
||||
let errorMsg = typeof response === 'string' ? response :
|
||||
(response.message || 'Gagal mengupload file');
|
||||
|
||||
function handleUploadComplete(file, isSuccess, errorMessage = null) {
|
||||
uploadQueue--;
|
||||
const index = uploadBatch.indexOf(file);
|
||||
if (index > -1) {
|
||||
uploadBatch.splice(index, 1);
|
||||
}
|
||||
handleUploadComplete(file, false, errorMsg);
|
||||
},
|
||||
|
||||
// Show individual error if any
|
||||
if (!isSuccess && errorMessage) {
|
||||
showErrorMessage(errorMessage);
|
||||
}
|
||||
success: function(file, response) {
|
||||
if (response.success) {
|
||||
const fileData = {
|
||||
path: response.path || file.path,
|
||||
name: file.name,
|
||||
description: '',
|
||||
category: 'lainnya',
|
||||
sub: '',
|
||||
param_name: paramName
|
||||
};
|
||||
|
||||
// If all uploads are complete
|
||||
if (uploadQueue === 0) {
|
||||
hideLoadingOverlay();
|
||||
// Add file to existing files set to prevent duplicates
|
||||
existingFiles.add(file.name);
|
||||
|
||||
// Show final status message
|
||||
const totalFiles = uploadBatch.length + 1; // +1 for current file
|
||||
if (totalFiles === 1) {
|
||||
// Single file upload
|
||||
if (isSuccess) {
|
||||
showSuccessMessage('Foto berhasil diupload');
|
||||
}
|
||||
addEditAndDeleteButtons(file, fileData);
|
||||
handleUploadComplete(file, true);
|
||||
} else {
|
||||
// Multiple files upload
|
||||
showSuccessMessage(`${totalFiles} foto berhasil diupload`);
|
||||
handleUploadComplete(file, false, response.message);
|
||||
}
|
||||
},
|
||||
|
||||
// Reset batch
|
||||
uploadBatch = [];
|
||||
init: function() {
|
||||
const dz = this;
|
||||
|
||||
// Clear processed files when all uploads complete
|
||||
this.on("queuecomplete", function() {
|
||||
processedFiles.clear();
|
||||
});
|
||||
|
||||
// Load existing photos
|
||||
loadExistingPhotos(this, paramName, existingFiles);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
function showLoadingOverlay() {
|
||||
const overlay = document.querySelector('.loading-overlay');
|
||||
if (!overlay) {
|
||||
// Buat elemen overlay
|
||||
const loadingOverlay = document.createElement('div');
|
||||
loadingOverlay.className = 'loading-overlay';
|
||||
loadingOverlay.style.cssText = `
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 9999;
|
||||
`;
|
||||
return myDropzone;
|
||||
} catch (error) {
|
||||
console.error('Dropzone initialization error:', error);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
// Tambahkan loader di dalam overlay
|
||||
loadingOverlay.innerHTML = '<div class="loader"></div>';
|
||||
function loadExistingPhotos(dropzone, paramName, existingFilesSet) {
|
||||
showLoadingOverlay();
|
||||
|
||||
// Tambahkan overlay ke dalam <body>
|
||||
document.body.appendChild(loadingOverlay);
|
||||
} else {
|
||||
// Tampilkan overlay jika sudah ada
|
||||
overlay.style.display = 'flex';
|
||||
$.ajax({
|
||||
url: "{{ route('surveyor.getFoto') }}",
|
||||
method: 'GET',
|
||||
data: {
|
||||
permohonan_id: {{ $permohonan->id ?? 0 }},
|
||||
dokument_id: '{{ request('dokument') ?? '' }}',
|
||||
param_name: paramName
|
||||
},
|
||||
headers: {
|
||||
'X-CSRF-TOKEN': '{{ csrf_token() }}'
|
||||
},
|
||||
success: function(response) {
|
||||
if (response.fotos && response.fotos.length) {
|
||||
response.fotos.forEach(function(foto) {
|
||||
var mockFile = {
|
||||
name: foto.name,
|
||||
size: foto.size || 12345,
|
||||
originalPath: foto.path
|
||||
};
|
||||
|
||||
// Add to existing files set to prevent duplicates
|
||||
existingFilesSet.add(foto.name);
|
||||
|
||||
dropzone.emit("addedfile", mockFile);
|
||||
dropzone.emit("thumbnail", mockFile, foto.path);
|
||||
dropzone.emit("complete", mockFile);
|
||||
addEditAndDeleteButtons(mockFile, {
|
||||
path: foto.path,
|
||||
name: foto.name,
|
||||
description: foto.description || '',
|
||||
category: foto.category || 'lainnya',
|
||||
sub: foto.sub || '',
|
||||
param_name: paramName
|
||||
});
|
||||
});
|
||||
}
|
||||
},
|
||||
error: function(xhr, status, error) {
|
||||
console.error('Gagal memuat foto:', error);
|
||||
showErrorMessage('Gagal memuat foto yang ada');
|
||||
},
|
||||
complete: function() {
|
||||
hideLoadingOverlay();
|
||||
}
|
||||
|
||||
|
||||
function hideLoadingOverlay() {
|
||||
const overlay = document.querySelector('.loading-overlay');
|
||||
if (overlay) overlay.style.display = 'none';
|
||||
}
|
||||
|
||||
function showSuccessMessage(message) {
|
||||
Swal.fire({
|
||||
icon: 'success',
|
||||
title: message,
|
||||
toast: true,
|
||||
position: 'top-end',
|
||||
showConfirmButton: false,
|
||||
timer: 1500
|
||||
});
|
||||
}
|
||||
|
||||
function showErrorMessage(message) {
|
||||
Swal.fire({
|
||||
icon: 'error',
|
||||
title: 'Upload Gagal',
|
||||
text: message || 'Error tidak diketahui'
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// Inisialisasi Dropzone untuk elemen awal dengan pengecekan
|
||||
function safeInitDropzone(selector, paramName) {
|
||||
setTimeout(() => {
|
||||
const dropzone = initDropzone(selector, paramName);
|
||||
if (!dropzone) {
|
||||
console.error(`Failed to initialize Dropzone for ${selector}`);
|
||||
}
|
||||
}, 100);
|
||||
}
|
||||
|
||||
// Inisialisasi dropzone untuk elemen awal
|
||||
safeInitDropzone('#upload-dropzone', 'upload_foto');
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
function handleUploadComplete(file, isSuccess, errorMessage = null) {
|
||||
uploadQueue--;
|
||||
const index = uploadBatch.indexOf(file);
|
||||
if (index > -1) {
|
||||
uploadBatch.splice(index, 1);
|
||||
}
|
||||
|
||||
// Show individual error if any
|
||||
if (!isSuccess && errorMessage) {
|
||||
showErrorMessage(errorMessage);
|
||||
}
|
||||
|
||||
// If all uploads are complete
|
||||
if (uploadQueue === 0) {
|
||||
hideLoadingOverlay();
|
||||
|
||||
// Show final status message
|
||||
const totalFiles = uploadBatch.length + 1; // +1 for current file
|
||||
if (totalFiles === 1) {
|
||||
// Single file upload
|
||||
if (isSuccess) {
|
||||
showSuccessMessage('Foto berhasil diupload');
|
||||
}
|
||||
} else {
|
||||
// Multiple files upload
|
||||
showSuccessMessage(`${totalFiles} foto berhasil diupload`);
|
||||
}
|
||||
|
||||
// Reset batch
|
||||
uploadBatch = [];
|
||||
}
|
||||
}
|
||||
|
||||
function showLoadingOverlay() {
|
||||
const overlay = document.querySelector('.loading-overlay');
|
||||
if (!overlay) {
|
||||
// Buat elemen overlay
|
||||
const loadingOverlay = document.createElement('div');
|
||||
loadingOverlay.className = 'loading-overlay';
|
||||
loadingOverlay.style.cssText = `
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 9999;
|
||||
`;
|
||||
|
||||
// Tambahkan loader di dalam overlay
|
||||
loadingOverlay.innerHTML = '<div class="loader"></div>';
|
||||
|
||||
// Tambahkan overlay ke dalam <body>
|
||||
document.body.appendChild(loadingOverlay);
|
||||
} else {
|
||||
// Tampilkan overlay jika sudah ada
|
||||
overlay.style.display = 'flex';
|
||||
}
|
||||
}
|
||||
|
||||
function hideLoadingOverlay() {
|
||||
const overlay = document.querySelector('.loading-overlay');
|
||||
if (overlay) overlay.style.display = 'none';
|
||||
}
|
||||
|
||||
function showSuccessMessage(message) {
|
||||
Swal.fire({
|
||||
icon: 'success',
|
||||
title: message,
|
||||
toast: true,
|
||||
position: 'top-end',
|
||||
showConfirmButton: false,
|
||||
timer: 1500
|
||||
});
|
||||
}
|
||||
|
||||
function showErrorMessage(message) {
|
||||
Swal.fire({
|
||||
icon: 'error',
|
||||
title: 'Upload Gagal',
|
||||
text: message || 'Error tidak diketahui'
|
||||
});
|
||||
}
|
||||
|
||||
// Inisialisasi Dropzone untuk elemen awal dengan pengecekan
|
||||
function safeInitDropzone(selector, paramName) {
|
||||
setTimeout(() => {
|
||||
const dropzone = initDropzone(selector, paramName);
|
||||
if (!dropzone) {
|
||||
console.error(`Failed to initialize Dropzone for ${selector}`);
|
||||
}
|
||||
}, 100);
|
||||
}
|
||||
|
||||
// Inisialisasi dropzone untuk elemen awal
|
||||
safeInitDropzone('#upload-dropzone', 'upload_foto');
|
||||
});
|
||||
|
||||
let fotoObjekJaminan = @json($fotoObjekJaminan);
|
||||
|
||||
|
||||
Reference in New Issue
Block a user