fix: perbaiki navigasi back di halaman laporan penilai dan tampilkan gambar/pdf pada daftar pustaka
This commit is contained in:
@@ -13,9 +13,12 @@
|
|||||||
<button id="tab-hasil" class="btn btn-sm btn-light">Hasil Inspeksi</button>
|
<button id="tab-hasil" class="btn btn-sm btn-light">Hasil Inspeksi</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex items-wrap gap-2.5">
|
<div class="flex items-wrap gap-2.5">
|
||||||
<a href="{{ $back ?? route()->previous()}}" class="btn btn-xs btn-info"><i
|
{{-- <a href="{{ $back ?? route()->previous()}}" class="btn btn-xs btn-info"><i
|
||||||
class="ki-filled ki-exit-left"></i>
|
class="ki-filled ki-exit-left"></i>
|
||||||
Back</a>
|
Back</a> --}}
|
||||||
|
<a id="back-button" class="btn btn-xs btn-info">
|
||||||
|
<i class="ki-filled ki-exit-left"></i> Back
|
||||||
|
</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -87,6 +90,18 @@
|
|||||||
hasilContent.classList.remove('hidden-tab');
|
hasilContent.classList.remove('hidden-tab');
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
document.getElementById('back-button').addEventListener('click', function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
|
console.log('Back button clicked', window.history.length);
|
||||||
|
if (window.history.length > 1) {
|
||||||
|
window.history.back();
|
||||||
|
} else {
|
||||||
|
window.location.href = "{{ $back ?? route()->previous()}}";
|
||||||
|
|
||||||
|
}
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
|||||||
@@ -57,7 +57,7 @@
|
|||||||
</label>
|
</label>
|
||||||
<div class="flex flex-wrap items-baseline w-full">
|
<div class="flex flex-wrap items-baseline w-full">
|
||||||
{{-- ambil nama file pathnya hilangkan --}}
|
{{-- ambil nama file pathnya hilangkan --}}
|
||||||
<a href="{{ asset($daftarPustaka->attachment) }}" class="badge badge-outline badge-md badge-info">{{ basename($daftarPustaka->attachment) }}
|
<a href="{{ asset('storage/' .$daftarPustaka->attachment) }}" class="badge badge-outline badge-md badge-info">{{ basename($daftarPustaka->attachment) }}
|
||||||
<i class="ki-filled ki-cloud-download"></i>
|
<i class="ki-filled ki-cloud-download"></i>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -239,20 +239,24 @@
|
|||||||
document.addEventListener('DOMContentLoaded', function() {
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
document.querySelectorAll('.show-pustaka').forEach(function(element) {
|
document.querySelectorAll('.show-pustaka').forEach(function(element) {
|
||||||
const url = element.getAttribute('data-url');
|
const url = element.getAttribute('data-url');
|
||||||
|
|
||||||
|
console.log(url);
|
||||||
|
|
||||||
const previewContent = element.querySelector('.preview-content');
|
const previewContent = element.querySelector('.preview-content');
|
||||||
|
|
||||||
if (!previewContent || !url) return;
|
if (!previewContent || !url) return;
|
||||||
|
|
||||||
const fileExtension = url.split('.').pop().toLowerCase();
|
const fileExtension = url.split('.').pop().toLowerCase();
|
||||||
|
|
||||||
|
const urlStorage = 'storage' + '/' + url;
|
||||||
if (fileExtension === 'pdf') {
|
if (fileExtension === 'pdf') {
|
||||||
PDFObject.embed(url, previewContent, {
|
PDFObject.embed(urlStorage, previewContent, {
|
||||||
height: "100%",
|
height: "100%",
|
||||||
width: "100%"
|
width: "100%"
|
||||||
});
|
});
|
||||||
} else if (['jpg', 'jpeg', 'png', 'gif'].includes(fileExtension)) {
|
} else if (['jpg', 'jpeg', 'png', 'gif'].includes(fileExtension)) {
|
||||||
previewContent.innerHTML = `
|
previewContent.innerHTML = `
|
||||||
<img src="${url}" alt="Preview"
|
<img src="${urlStorage}" alt="Preview"
|
||||||
class="w-full h-full object-cover rounded" />
|
class="w-full h-full object-cover rounded" />
|
||||||
`;
|
`;
|
||||||
} else {
|
} else {
|
||||||
|
|||||||
@@ -58,11 +58,13 @@
|
|||||||
const fileExtension = url.split('.').pop().toLowerCase();
|
const fileExtension = url.split('.').pop().toLowerCase();
|
||||||
const previewContent = document.getElementById('previewContent');
|
const previewContent = document.getElementById('previewContent');
|
||||||
|
|
||||||
|
const urlStorage = 'storage' + '/' + url;
|
||||||
|
|
||||||
if (['pdf'].includes(fileExtension)) {
|
if (['pdf'].includes(fileExtension)) {
|
||||||
PDFObject.embed(url, "#previewContent");
|
PDFObject.embed(urlStorage, "#previewContent");
|
||||||
} else if (['jpg', 'jpeg', 'png', 'gif'].includes(fileExtension)) {
|
} else if (['jpg', 'jpeg', 'png', 'gif'].includes(fileExtension)) {
|
||||||
previewContent.innerHTML =
|
previewContent.innerHTML =
|
||||||
`<img src="${url}" alt="Preview" class="max-w-full max-h-full object-contain">`;
|
`<img src="${urlStorage}" alt="Preview" class="max-w-full max-h-full object-contain">`;
|
||||||
} else {
|
} else {
|
||||||
previewContent.innerHTML = '<p class="text-center">Unsupported file type</p>';
|
previewContent.innerHTML = '<p class="text-center">Unsupported file type</p>';
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -219,7 +219,8 @@
|
|||||||
@push('scripts')
|
@push('scripts')
|
||||||
<script type="module">
|
<script type="module">
|
||||||
const element = document.querySelector('#laporan-penilai-jaminan-table');
|
const element = document.querySelector('#laporan-penilai-jaminan-table');
|
||||||
const searchInput = document.getElementById('search');;
|
|
||||||
|
const searchInput = document.getElementById('search');
|
||||||
const startDateInput = document.getElementById('start_date');
|
const startDateInput = document.getElementById('start_date');
|
||||||
const endDateInput = document.getElementById('end_date');
|
const endDateInput = document.getElementById('end_date');
|
||||||
const branchFilter = document.getElementById('branch_filter');
|
const branchFilter = document.getElementById('branch_filter');
|
||||||
@@ -227,7 +228,6 @@
|
|||||||
const filterTanggalButton = document.getElementById('filter_tanggal');
|
const filterTanggalButton = document.getElementById('filter_tanggal');
|
||||||
const exportButton = document.getElementById('export-btn');
|
const exportButton = document.getElementById('export-btn');
|
||||||
|
|
||||||
|
|
||||||
const selectAllCheckbox = document.getElementById('check-all');
|
const selectAllCheckbox = document.getElementById('check-all');
|
||||||
const statusCheckboxes = document.querySelectorAll('.status-checkbox');
|
const statusCheckboxes = document.querySelectorAll('.status-checkbox');
|
||||||
|
|
||||||
@@ -242,6 +242,11 @@
|
|||||||
const exportType = document.getElementById('export_type');
|
const exportType = document.getElementById('export_type');
|
||||||
const exportSearch = document.getElementById('export_search');
|
const exportSearch = document.getElementById('export_search');
|
||||||
const apiUrl = element.getAttribute('data-api-url');
|
const apiUrl = element.getAttribute('data-api-url');
|
||||||
|
|
||||||
|
// Simple pagination state management
|
||||||
|
let currentPage = 1;
|
||||||
|
let isReturningFromDetail = false;
|
||||||
|
|
||||||
const dataTableOptions = {
|
const dataTableOptions = {
|
||||||
apiEndpoint: apiUrl,
|
apiEndpoint: apiUrl,
|
||||||
pageSize: 5,
|
pageSize: 5,
|
||||||
@@ -293,7 +298,6 @@
|
|||||||
return data.debiture && data.debiture.name ? `${data.debiture.name}` : '-';
|
return data.debiture && data.debiture.name ? `${data.debiture.name}` : '-';
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
tujuan_penilaian_id: {
|
tujuan_penilaian_id: {
|
||||||
title: 'Tujuan Penilaian',
|
title: 'Tujuan Penilaian',
|
||||||
render: (item, data) => {
|
render: (item, data) => {
|
||||||
@@ -309,12 +313,10 @@
|
|||||||
}).join(', ');
|
}).join(', ');
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
laporan: {
|
laporan: {
|
||||||
title: 'Status',
|
title: 'Status',
|
||||||
render: (item, data) => {
|
render: (item, data) => {
|
||||||
let badgeClass = '';
|
let badgeClass = '';
|
||||||
|
|
||||||
const statusLaporan = data.penilai?.type_penilai || '-';
|
const statusLaporan = data.penilai?.type_penilai || '-';
|
||||||
|
|
||||||
switch (statusLaporan.toLowerCase()) {
|
switch (statusLaporan.toLowerCase()) {
|
||||||
@@ -343,7 +345,7 @@
|
|||||||
actions: {
|
actions: {
|
||||||
title: 'Action',
|
title: 'Action',
|
||||||
render: (item, data) => {
|
render: (item, data) => {
|
||||||
const status = data.status; // Anggap status berada di dalam objek data
|
const status = data.status;
|
||||||
const dokumenjaminan = data.dokumenjaminan || [];
|
const dokumenjaminan = data.dokumenjaminan || [];
|
||||||
|
|
||||||
return `
|
return `
|
||||||
@@ -355,13 +357,12 @@
|
|||||||
<a class="btn btn-sm btn-primary" href="surveyor/print-out-inspeksi/${data.id}/${dokumen.id}/${dokumen.jenis_jaminan_id}">
|
<a class="btn btn-sm btn-primary" href="surveyor/print-out-inspeksi/${data.id}/${dokumen.id}/${dokumen.jenis_jaminan_id}">
|
||||||
<i class="ki-outline ki-printer"></i>Inspeksi
|
<i class="ki-outline ki-printer"></i>Inspeksi
|
||||||
</a>
|
</a>
|
||||||
<a class="btn btn-sm btn-info" href="laporan-penilai-jaminan/show/${data.id}/${dokumen.id}/${dokumen.jenis_jaminan_id}" >
|
<a class="btn btn-sm btn-info detail-btn" href="laporan-penilai-jaminan/show/${data.id}/${dokumen.id}/${dokumen.jenis_jaminan_id}">
|
||||||
<i class="ki-filled ki-eye"></i>Lihat
|
<i class="ki-filled ki-eye"></i>Lihat
|
||||||
</a>
|
</a>
|
||||||
<a class="btn btn-sm btn-success" href="penilai/print-out-laporan/${data.id}/${dokumen.id}/${dokumen.jenis_jaminan_id}">
|
<a class="btn btn-sm btn-success" href="penilai/print-out-laporan/${data.id}/${dokumen.id}/${dokumen.jenis_jaminan_id}">
|
||||||
<i class="ki-filled ki-printer"></i>Laporan
|
<i class="ki-filled ki-printer"></i>Laporan
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
`;
|
`;
|
||||||
}).join('') : ''
|
}).join('') : ''
|
||||||
}
|
}
|
||||||
@@ -369,12 +370,82 @@
|
|||||||
`;
|
`;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
let dataTable = new KTDataTable(element, dataTableOptions);
|
let dataTable = new KTDataTable(element, dataTableOptions);
|
||||||
|
const fromDetail = true;
|
||||||
|
if (fromDetail) {
|
||||||
|
isReturningFromDetail = true;
|
||||||
|
console.log('Returning from detail page');
|
||||||
|
// Remove the parameter from URL
|
||||||
|
window.history.replaceState({}, document.title, window.location.pathname);
|
||||||
|
setTimeout(() => {
|
||||||
|
restoreCurrentPage();
|
||||||
|
isReturningFromDetail = false;
|
||||||
|
}, 500);
|
||||||
|
}
|
||||||
|
|
||||||
|
function getCurrentPageFromDOM() {
|
||||||
|
const activePage = document.querySelector('.pagination .btn.active');
|
||||||
|
if (activePage) {
|
||||||
|
const pageText = activePage.textContent.trim();
|
||||||
|
const pageNum = parseInt(pageText);
|
||||||
|
return isNaN(pageNum) ? 1 : pageNum;
|
||||||
|
}
|
||||||
|
return 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
function saveCurrentPage() {
|
||||||
|
const page = getCurrentPageFromDOM();
|
||||||
|
currentPage = page;
|
||||||
|
sessionStorage.setItem('currentTablePage', currentPage.toString());
|
||||||
|
}
|
||||||
|
|
||||||
|
function restoreCurrentPage() {
|
||||||
|
const savedPage = sessionStorage.getItem('currentTablePage');
|
||||||
|
if (savedPage && savedPage !== '1') {
|
||||||
|
currentPage = parseInt(savedPage);
|
||||||
|
console.log('Restoring to page:', currentPage);
|
||||||
|
|
||||||
|
// Use the goPage method to navigate to the saved page
|
||||||
|
dataTable.goPage(currentPage);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Listen for pagination events to track current page
|
||||||
|
element.addEventListener('pagination', function(e) {
|
||||||
|
const page = e.detail.page;
|
||||||
|
currentPage = page;
|
||||||
|
console.log('Page changed to:', page);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Alternative: Listen for pagination button clicks
|
||||||
|
document.addEventListener('click', function(e) {
|
||||||
|
if (e.target.matches('.pagination .btn') && !e.target.closest('.detail-btn')) {
|
||||||
|
setTimeout(() => {
|
||||||
|
currentPage = getCurrentPageFromDOM();
|
||||||
|
console.log('Current page updated to:', currentPage);
|
||||||
|
}, 100);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Detail page redirection
|
||||||
|
document.addEventListener('click', function(e) {
|
||||||
|
if (e.target.closest('.detail-btn')) {
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
|
// Save current page before navigating
|
||||||
|
const currentPageNum = getCurrentPageFromDOM();
|
||||||
|
currentPage = currentPageNum;
|
||||||
|
sessionStorage.setItem('currentTablePage', currentPage.toString());
|
||||||
|
console.log('Saving page before detail navigation:', currentPage);
|
||||||
|
|
||||||
|
const link = e.target.closest('.detail-btn');
|
||||||
|
const href = link.getAttribute('href');
|
||||||
|
window.location.href = href;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
// Search functionality
|
// Search functionality
|
||||||
searchInput.addEventListener('input', function() {
|
searchInput.addEventListener('input', function() {
|
||||||
@@ -392,7 +463,6 @@
|
|||||||
const branch = branchFilter.value;
|
const branch = branchFilter.value;
|
||||||
const laporan = Array.from(laporanFilter.selectedOptions).map(option => option.value);
|
const laporan = Array.from(laporanFilter.selectedOptions).map(option => option.value);
|
||||||
|
|
||||||
|
|
||||||
let filters = {};
|
let filters = {};
|
||||||
if (searchInput.value) {
|
if (searchInput.value) {
|
||||||
filters.search = searchInput.value;
|
filters.search = searchInput.value;
|
||||||
@@ -438,10 +508,8 @@
|
|||||||
|
|
||||||
if (selectedStatuses.length === 0) {
|
if (selectedStatuses.length === 0) {
|
||||||
dataTable.search('');
|
dataTable.search('');
|
||||||
console.log(selectedStatuses);
|
|
||||||
} else {
|
} else {
|
||||||
dataTable.search(selectedStatuses.join(','), true);
|
dataTable.search(selectedStatuses.join(','), true);
|
||||||
console.log(selectedStatuses);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
dataTable.reload();
|
dataTable.reload();
|
||||||
@@ -451,16 +519,13 @@
|
|||||||
selectAllCheckbox.checked = allChecked;
|
selectAllCheckbox.checked = allChecked;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Single export button functionality
|
// Export functionality
|
||||||
exportButton.addEventListener('click', function(e) {
|
exportButton.addEventListener('click', function(e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
|
||||||
// Check if any rows are selected
|
|
||||||
const selectedIds = getSelectedRowIds();
|
const selectedIds = getSelectedRowIds();
|
||||||
|
|
||||||
// Determine export type based on context
|
|
||||||
if (selectedIds.length > 0) {
|
if (selectedIds.length > 0) {
|
||||||
// If rows are selected, export those
|
|
||||||
exportData({
|
exportData({
|
||||||
selected_ids: selectedIds,
|
selected_ids: selectedIds,
|
||||||
export_type: 'selected'
|
export_type: 'selected'
|
||||||
@@ -476,14 +541,11 @@
|
|||||||
export_type: 'filtered'
|
export_type: 'filtered'
|
||||||
});
|
});
|
||||||
} else if (searchInput.value) {
|
} else if (searchInput.value) {
|
||||||
// If only search is applied, export filtered results
|
|
||||||
exportData({
|
exportData({
|
||||||
search: searchInput.value,
|
search: searchInput.value,
|
||||||
export_type: 'filtered'
|
export_type: 'filtered'
|
||||||
});
|
});
|
||||||
|
|
||||||
} else {
|
} else {
|
||||||
// If no selection and no filters, export all
|
|
||||||
exportData({
|
exportData({
|
||||||
export_type: 'all'
|
export_type: 'all'
|
||||||
});
|
});
|
||||||
@@ -491,7 +553,6 @@
|
|||||||
});
|
});
|
||||||
|
|
||||||
function exportData(filters = {}) {
|
function exportData(filters = {}) {
|
||||||
// Set filter values in the hidden form
|
|
||||||
exportStartDate.value = filters.start_date || '';
|
exportStartDate.value = filters.start_date || '';
|
||||||
exportEndDate.value = filters.end_date || '';
|
exportEndDate.value = filters.end_date || '';
|
||||||
exportStatus.value = filters.status ? filters.status.join(',') : '';
|
exportStatus.value = filters.status ? filters.status.join(',') : '';
|
||||||
@@ -500,7 +561,6 @@
|
|||||||
exportSelectedIds.value = filters.selected_ids ? filters.selected_ids.join(',') : '';
|
exportSelectedIds.value = filters.selected_ids ? filters.selected_ids.join(',') : '';
|
||||||
exportType.value = filters.export_type || 'all';
|
exportType.value = filters.export_type || 'all';
|
||||||
exportSearch.value = filters.search || '';
|
exportSearch.value = filters.search || '';
|
||||||
// Submit the form
|
|
||||||
exportForm.submit();
|
exportForm.submit();
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -514,7 +574,12 @@
|
|||||||
const checkboxes = document.querySelectorAll('[data-datatable-row-check="true"]:checked');
|
const checkboxes = document.querySelectorAll('[data-datatable-row-check="true"]:checked');
|
||||||
return Array.from(checkboxes).map(checkbox => checkbox.value);
|
return Array.from(checkboxes).map(checkbox => checkbox.value);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Save page before leaving (only when not going to detail)
|
||||||
|
window.addEventListener('beforeunload', function() {
|
||||||
|
if (!isReturningFromDetail) {
|
||||||
|
saveCurrentPage();
|
||||||
|
}
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
@endpush
|
@endpush
|
||||||
|
|||||||
Reference in New Issue
Block a user