🔧 refactor(inspeksi): gunakan updateOrCreate & perbaikan kode
- Ganti `Inspeksi::create()` → `updateOrCreate()` di PenilaiController (2x) & SurveyorController (1x) dengan kondisi upsert (permohonan_id + dokument_id)
- Tambah logging di SaveFormInspesksiService.php (`Log::info`) untuk debugging & validasi action kosong
- Perbaiki error handling dengan pesan lebih informatif `'Gagal menyimpan data : '.$e->getMessage()`
- Refaktor parsing action memakai array_map & array_filter agar lebih efisien
- Rapikan kode: hapus baris kosong tidak perlu & improve readability
- Perbaiki urutan class CSS di beberapa Blade view (rap-penilai, penilai/index, surveyor/inspeksi)
- Perbaiki XSS di rap-penilai.blade.php dengan `{!! json_encode($dokumen->address ?? '') !!}`
- Tingkatkan integritas database: cegah duplikasi data inspeksi via updateOrCreate()
- Tambah keamanan & maintainability: logging, validasi input, perbaikan format, serta pembersihan kode lama
This commit is contained in:
@@ -6,7 +6,7 @@
|
||||
|
||||
@section('content')
|
||||
@include('lpj::assetsku.includenya')
|
||||
<div class="w-full grid gap-5 lg:gap-7.5 mx-auto">
|
||||
<div class="grid gap-5 mx-auto w-full lg:gap-7.5">
|
||||
<form id="formInspeksi" method="POST" enctype="multipart/form-data" class="grid gap-5">
|
||||
@csrf
|
||||
<input id="permohonan_id" type="hidden" name="permohonan_id" value="{{ $permohonan->id }}">
|
||||
@@ -46,14 +46,14 @@
|
||||
@endif
|
||||
@endforeach
|
||||
@endif
|
||||
<div class="card border border-agi-100 w-full rounded-lg shadow-md overflow-hidden">
|
||||
<div class="overflow-hidden w-full rounded-lg border shadow-md card border-agi-100">
|
||||
<div class="card-header light:bg-agi-50">
|
||||
<h3 class="card-title uppercase">
|
||||
<h3 class="uppercase card-title">
|
||||
Tanda Tangan
|
||||
</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="flex items-baseline justify-between flex-wrap lg:flex-nowrap">
|
||||
<div class="flex flex-wrap justify-between items-baseline lg:flex-nowrap">
|
||||
@foreach (['penilai', 'cabang', 'debitur', 'kjpp'] as $type)
|
||||
@include('lpj::component.signature-pad', ['type' => $type])
|
||||
@endforeach
|
||||
@@ -65,7 +65,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex justify-end gap-2" style="margin-right: 20px; margin-top: 20px">
|
||||
<div class="flex gap-2 justify-end" style="margin-right: 20px; margin-top: 20px">
|
||||
<button type="button" class="btn btn-primary" id="saveButton" onclick="submitData()">
|
||||
<i class="ki-filled ki-save-2"></i>
|
||||
<span id="saveButtonText">Simpan</span>
|
||||
@@ -95,122 +95,122 @@
|
||||
console.log(datas);
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const signaturePads = {};
|
||||
const types = ['penilai', 'cabang', 'debitur', 'kjpp'];
|
||||
const types = ['penilai', 'cabang', 'debitur', 'kjpp'];
|
||||
|
||||
// Initialize all signature pads
|
||||
types.forEach(type => initSignaturePad(type));
|
||||
// Initialize all signature pads
|
||||
types.forEach(type => initSignaturePad(type));
|
||||
|
||||
function initSignaturePad(type) {
|
||||
const canvas = document.getElementById(`signature-pad-${type}`);
|
||||
if (!canvas) return;
|
||||
function initSignaturePad(type) {
|
||||
const canvas = document.getElementById(`signature-pad-${type}`);
|
||||
if (!canvas) return;
|
||||
|
||||
// Improved canvas sizing with strict boundary control
|
||||
function resizeCanvas() {
|
||||
const container = canvas.closest('.signature-pad-container');
|
||||
const containerWidth = container.clientWidth;
|
||||
// Improved canvas sizing with strict boundary control
|
||||
function resizeCanvas() {
|
||||
const container = canvas.closest('.signature-pad-container');
|
||||
const containerWidth = container.clientWidth;
|
||||
|
||||
// Set canvas style dimensions
|
||||
canvas.style.width = '100%';
|
||||
canvas.style.height = `${containerWidth * 0.5}px`; // 2:1 aspect ratio
|
||||
// Set canvas style dimensions
|
||||
canvas.style.width = '100%';
|
||||
canvas.style.height = `${containerWidth * 0.5}px`; // 2:1 aspect ratio
|
||||
|
||||
// Set actual canvas dimensions with high DPI support
|
||||
const ratio = window.devicePixelRatio || 1;
|
||||
canvas.width = containerWidth * ratio;
|
||||
canvas.height = (containerWidth * 0.5) * ratio;
|
||||
// Set actual canvas dimensions with high DPI support
|
||||
const ratio = window.devicePixelRatio || 1;
|
||||
canvas.width = containerWidth * ratio;
|
||||
canvas.height = (containerWidth * 0.5) * ratio;
|
||||
|
||||
// Scale canvas context
|
||||
const ctx = canvas.getContext('2d');
|
||||
ctx.scale(ratio, ratio);
|
||||
// Scale canvas context
|
||||
const ctx = canvas.getContext('2d');
|
||||
ctx.scale(ratio, ratio);
|
||||
|
||||
// Clear and redraw existing signature if any
|
||||
if (signaturePads[type] && !signaturePads[type].isEmpty()) {
|
||||
const signaturePad = signaturePads[type];
|
||||
const imageData = signaturePad.toData();
|
||||
signaturePad.clear();
|
||||
signaturePad.fromData(imageData);
|
||||
}
|
||||
}
|
||||
|
||||
// Create signature pad with boundary and scaling control
|
||||
const signaturePad = new SignaturePad(canvas, {
|
||||
backgroundColor: 'rgba(255, 255, 255, 0)',
|
||||
penColor: 'rgb(0, 0, 0)',
|
||||
minWidth: 0.5,
|
||||
maxWidth: 2.5,
|
||||
throttle: 16,
|
||||
dotSize: 2,
|
||||
|
||||
// Custom function to control signature drawing
|
||||
onBegin: (event) => {
|
||||
const ctx = canvas.getContext('2d');
|
||||
const rect = canvas.getBoundingClientRect();
|
||||
const scaleX = canvas.width / rect.width;
|
||||
const scaleY = canvas.height / rect.height;
|
||||
|
||||
// Ensure drawing stays within canvas
|
||||
if (
|
||||
event.clientX < rect.left ||
|
||||
event.clientX > rect.right ||
|
||||
event.clientY < rect.top ||
|
||||
event.clientY > rect.bottom
|
||||
) {
|
||||
return false;
|
||||
// Clear and redraw existing signature if any
|
||||
if (signaturePads[type] && !signaturePads[type].isEmpty()) {
|
||||
const signaturePad = signaturePads[type];
|
||||
const imageData = signaturePad.toData();
|
||||
signaturePad.clear();
|
||||
signaturePad.fromData(imageData);
|
||||
}
|
||||
}
|
||||
|
||||
// Create signature pad with boundary and scaling control
|
||||
const signaturePad = new SignaturePad(canvas, {
|
||||
backgroundColor: 'rgba(255, 255, 255, 0)',
|
||||
penColor: 'rgb(0, 0, 0)',
|
||||
minWidth: 0.5,
|
||||
maxWidth: 2.5,
|
||||
throttle: 16,
|
||||
dotSize: 2,
|
||||
|
||||
// Custom function to control signature drawing
|
||||
onBegin: (event) => {
|
||||
const ctx = canvas.getContext('2d');
|
||||
const rect = canvas.getBoundingClientRect();
|
||||
const scaleX = canvas.width / rect.width;
|
||||
const scaleY = canvas.height / rect.height;
|
||||
|
||||
// Ensure drawing stays within canvas
|
||||
if (
|
||||
event.clientX < rect.left ||
|
||||
event.clientX > rect.right ||
|
||||
event.clientY < rect.top ||
|
||||
event.clientY > rect.bottom
|
||||
) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
});
|
||||
signaturePads[type] = signaturePad;
|
||||
|
||||
// Initial resize
|
||||
resizeCanvas();
|
||||
|
||||
// Load existing signature
|
||||
if (type === 'penilai' || type === 'cabang') {
|
||||
loadPenilaiAndCabangSignature(type, signaturePad);
|
||||
} else {
|
||||
loadSignature(type, signaturePad);
|
||||
}
|
||||
|
||||
// Add event listeners
|
||||
addEventListeners(type, signaturePad);
|
||||
|
||||
// Add resize listener
|
||||
window.addEventListener('resize', () => {
|
||||
resizeCanvas();
|
||||
});
|
||||
}
|
||||
});
|
||||
signaturePads[type] = signaturePad;
|
||||
|
||||
// Initial resize
|
||||
resizeCanvas();
|
||||
function drawSignature(signaturePad, imageUrl) {
|
||||
const image = new Image();
|
||||
image.crossOrigin = 'Anonymous';
|
||||
image.onload = function() {
|
||||
const ctx = signaturePad.canvas.getContext('2d');
|
||||
const canvasWidth = signaturePad.canvas.width;
|
||||
const canvasHeight = signaturePad.canvas.height;
|
||||
|
||||
// Load existing signature
|
||||
if (type === 'penilai' || type === 'cabang') {
|
||||
loadPenilaiAndCabangSignature(type, signaturePad);
|
||||
} else {
|
||||
loadSignature(type, signaturePad);
|
||||
}
|
||||
// Clear previous content
|
||||
ctx.clearRect(0, 0, canvasWidth, canvasHeight);
|
||||
|
||||
// Add event listeners
|
||||
addEventListeners(type, signaturePad);
|
||||
// Calculate scaling to fit within canvas while maintaining aspect ratio
|
||||
const scale = Math.min(
|
||||
canvasWidth / image.width,
|
||||
canvasHeight / image.height
|
||||
);
|
||||
|
||||
// Add resize listener
|
||||
window.addEventListener('resize', () => {
|
||||
resizeCanvas();
|
||||
});
|
||||
}
|
||||
const scaledWidth = image.width * scale;
|
||||
const scaledHeight = image.height * scale;
|
||||
|
||||
function drawSignature(signaturePad, imageUrl) {
|
||||
const image = new Image();
|
||||
image.crossOrigin = 'Anonymous';
|
||||
image.onload = function() {
|
||||
const ctx = signaturePad.canvas.getContext('2d');
|
||||
const canvasWidth = signaturePad.canvas.width;
|
||||
const canvasHeight = signaturePad.canvas.height;
|
||||
// Center the image
|
||||
const x = (canvasWidth - scaledWidth) / 2;
|
||||
const y = (canvasHeight - scaledHeight) / 2;
|
||||
|
||||
// Clear previous content
|
||||
ctx.clearRect(0, 0, canvasWidth, canvasHeight);
|
||||
|
||||
// Calculate scaling to fit within canvas while maintaining aspect ratio
|
||||
const scale = Math.min(
|
||||
canvasWidth / image.width,
|
||||
canvasHeight / image.height
|
||||
);
|
||||
|
||||
const scaledWidth = image.width * scale;
|
||||
const scaledHeight = image.height * scale;
|
||||
|
||||
// Center the image
|
||||
const x = (canvasWidth - scaledWidth) / 2;
|
||||
const y = (canvasHeight - scaledHeight) / 2;
|
||||
|
||||
// Draw the scaled and centered image
|
||||
ctx.drawImage(image, x, y, scaledWidth, scaledHeight);
|
||||
};
|
||||
image.onerror = function() {
|
||||
console.error('Error loading signature image');
|
||||
};
|
||||
image.src = imageUrl;
|
||||
}
|
||||
// Draw the scaled and centered image
|
||||
ctx.drawImage(image, x, y, scaledWidth, scaledHeight);
|
||||
};
|
||||
image.onerror = function() {
|
||||
console.error('Error loading signature image');
|
||||
};
|
||||
image.src = imageUrl;
|
||||
}
|
||||
|
||||
function addEventListeners(type, signaturePad) {
|
||||
document.getElementById(`save-${type}`)?.addEventListener('click', () => saveSignature(type,
|
||||
@@ -519,17 +519,17 @@
|
||||
const formData = new FormData(form);
|
||||
|
||||
const fotoFields = [
|
||||
'foto_gistaru',
|
||||
'foto_bhumi',
|
||||
'foto_argis_region',
|
||||
'foto_tempat',
|
||||
'foto_sentuh_tanahku',
|
||||
'upload_gs'
|
||||
];
|
||||
'foto_gistaru',
|
||||
'foto_bhumi',
|
||||
'foto_argis_region',
|
||||
'foto_tempat',
|
||||
'foto_sentuh_tanahku',
|
||||
'upload_gs'
|
||||
];
|
||||
|
||||
fotoFields.forEach((field) => {
|
||||
formData.delete(field);
|
||||
});
|
||||
fotoFields.forEach((field) => {
|
||||
formData.delete(field);
|
||||
});
|
||||
$.ajax({
|
||||
url: '{{ route('surveyor.store') }}',
|
||||
type: 'POST',
|
||||
|
||||
Reference in New Issue
Block a user