fix: perbaikkan tampilan dan print out lpj setalah migrate db old ke db new
This commit is contained in:
majid
@@ -81,10 +81,12 @@
|
||||
</div>
|
||||
@php
|
||||
use Modules\Usermanagement\Models\User;
|
||||
$cabangUser = User::where('id', $permohonan->user->id)->first();
|
||||
$cabangUser = null;
|
||||
|
||||
if ($permohonan->user) {
|
||||
$cabangUser = User::where('id', $permohonan->user->id)->first();
|
||||
}
|
||||
// print_r($cabangUser->sign);
|
||||
|
||||
@endphp
|
||||
@endsection
|
||||
|
||||
@@ -95,122 +97,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,
|
||||
@@ -237,7 +239,7 @@
|
||||
(type === 'penilai' ?
|
||||
`{{ asset('storage/signatures/' . Auth::user()->id . '/' . Auth::user()->sign) }}` :
|
||||
(type === 'cabang' ?
|
||||
`{{ asset('storage/signatures/' . $cabangUser->id . '/' . $cabangUser->sign) }}` :
|
||||
`{{ asset('storage/signatures/' . $cabangUser?->id . '/' . $cabangUser?->sign) }}` :
|
||||
'')) :
|
||||
signaturePad.toDataURL('image/png', 1.0); // Use full quality
|
||||
|
||||
@@ -332,13 +334,13 @@
|
||||
} else {
|
||||
const signUrl = type === 'penilai' ?
|
||||
`{{ asset('storage/signatures/' . Auth::user()->id . '/' . Auth::user()->sign) }}` :
|
||||
`{{ asset('storage/signatures/' . $cabangUser->id . '/' . $cabangUser->sign) }}`;
|
||||
`{{ asset('storage/signatures/' . $cabangUser?->id . '/' . $cabangUser?->sign) }}`;
|
||||
|
||||
drawSignature(signaturePad, signUrl);
|
||||
|
||||
const defaultName = type === 'penilai' ?
|
||||
`{{ Auth::user()->name }}` :
|
||||
`{{ $cabangUser->name }}`;
|
||||
`{{ $cabangUser?->name }}`;
|
||||
if (nameInputElement) {
|
||||
nameInputElement.value = defaultName;
|
||||
}
|
||||
@@ -362,7 +364,7 @@
|
||||
(type === 'penilai' ?
|
||||
`{{ asset('storage/signatures/' . Auth::user()->id . '/' . Auth::user()->sign) }}` :
|
||||
(type === 'cabang' ?
|
||||
`{{ asset('storage/signatures/' . $cabangUser->id . '/' . $cabangUser->sign) }}` :
|
||||
`{{ asset('storage/signatures/' . $cabangUser?->id . '/' . $cabangUser?->sign) }}` :
|
||||
'')) :
|
||||
signaturePad.toDataURL('image/png');
|
||||
|
||||
@@ -519,17 +521,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