From 027c698a115589006af966d513aeb1a3926673a6 Mon Sep 17 00:00:00 2001
From: majid <rustammajid76@gmail.com>
Date: Tue, 8 Jul 2025 17:04:19 +0700
Subject: [PATCH] fix: perbaiki navigasi back di halaman laporan penilai dan
 tampilkan gambar/pdf pada daftar pustaka

---
 .../component/show-laporan-inspeksi.blade.php |  19 ++-
 .../views/daftar-pustaka/create.blade.php     |   2 +-
 .../views/daftar-pustaka/index.blade.php      |   8 +-
 resources/views/daftar-pustaka/show.blade.php |   6 +-
 .../laporan-penilai-jaminan/index.blade.php   | 123 +++++++++++++-----
 5 files changed, 122 insertions(+), 36 deletions(-)

diff --git a/resources/views/component/show-laporan-inspeksi.blade.php b/resources/views/component/show-laporan-inspeksi.blade.php
index 04ec6a8..517b6cf 100644
--- a/resources/views/component/show-laporan-inspeksi.blade.php
+++ b/resources/views/component/show-laporan-inspeksi.blade.php
@@ -13,9 +13,12 @@
                     <button id="tab-hasil" class="btn btn-sm btn-light">Hasil Inspeksi</button>
                 </div>
                 <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>
-                        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>
@@ -87,6 +90,18 @@
                     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>
 
         <style>
diff --git a/resources/views/daftar-pustaka/create.blade.php b/resources/views/daftar-pustaka/create.blade.php
index f35d03d..ce227f4 100644
--- a/resources/views/daftar-pustaka/create.blade.php
+++ b/resources/views/daftar-pustaka/create.blade.php
@@ -57,7 +57,7 @@
                             </label>
                             <div class="flex flex-wrap items-baseline w-full">
                                 {{-- ambil nama file pathnya hilangkan --}}
-                                <a href="{{ asset($daftarPustaka->attachment) }}" class="badge badge-outline badge-md badge-info">{{ basename($daftarPustaka->attachment) }} &nbsp;
+                                <a href="{{ asset('storage/' .$daftarPustaka->attachment) }}" class="badge badge-outline badge-md badge-info">{{ basename($daftarPustaka->attachment) }} &nbsp;
                                    <i class="ki-filled ki-cloud-download"></i>
                                 </a>
                             </div>
diff --git a/resources/views/daftar-pustaka/index.blade.php b/resources/views/daftar-pustaka/index.blade.php
index 847a640..9e0644b 100644
--- a/resources/views/daftar-pustaka/index.blade.php
+++ b/resources/views/daftar-pustaka/index.blade.php
@@ -239,20 +239,24 @@
         document.addEventListener('DOMContentLoaded', function() {
             document.querySelectorAll('.show-pustaka').forEach(function(element) {
                 const url = element.getAttribute('data-url');
+
+                console.log(url);
+
                 const previewContent = element.querySelector('.preview-content');
 
                 if (!previewContent || !url) return;
 
                 const fileExtension = url.split('.').pop().toLowerCase();
 
+                const urlStorage = 'storage' + '/' + url;
                 if (fileExtension === 'pdf') {
-                    PDFObject.embed(url, previewContent, {
+                    PDFObject.embed(urlStorage, previewContent, {
                         height: "100%",
                         width: "100%"
                     });
                 } else if (['jpg', 'jpeg', 'png', 'gif'].includes(fileExtension)) {
                     previewContent.innerHTML = `
-                <img src="${url}" alt="Preview"
+                <img src="${urlStorage}" alt="Preview"
                      class="w-full h-full object-cover rounded" />
             `;
                 } else {
diff --git a/resources/views/daftar-pustaka/show.blade.php b/resources/views/daftar-pustaka/show.blade.php
index 0472df0..8d47497 100644
--- a/resources/views/daftar-pustaka/show.blade.php
+++ b/resources/views/daftar-pustaka/show.blade.php
@@ -58,11 +58,13 @@
             const fileExtension = url.split('.').pop().toLowerCase();
             const previewContent = document.getElementById('previewContent');
 
+            const urlStorage = 'storage' + '/' + url;
+
             if (['pdf'].includes(fileExtension)) {
-                PDFObject.embed(url, "#previewContent");
+                PDFObject.embed(urlStorage, "#previewContent");
             } else if (['jpg', 'jpeg', 'png', 'gif'].includes(fileExtension)) {
                 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 {
                 previewContent.innerHTML = '<p class="text-center">Unsupported file type</p>';
             }
diff --git a/resources/views/laporan-penilai-jaminan/index.blade.php b/resources/views/laporan-penilai-jaminan/index.blade.php
index d4a64e8..0362223 100644
--- a/resources/views/laporan-penilai-jaminan/index.blade.php
+++ b/resources/views/laporan-penilai-jaminan/index.blade.php
@@ -219,7 +219,8 @@
 @push('scripts')
     <script type="module">
         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 endDateInput = document.getElementById('end_date');
         const branchFilter = document.getElementById('branch_filter');
@@ -227,7 +228,6 @@
         const filterTanggalButton = document.getElementById('filter_tanggal');
         const exportButton = document.getElementById('export-btn');
 
-
         const selectAllCheckbox = document.getElementById('check-all');
         const statusCheckboxes = document.querySelectorAll('.status-checkbox');
 
@@ -242,6 +242,11 @@
         const exportType = document.getElementById('export_type');
         const exportSearch = document.getElementById('export_search');
         const apiUrl = element.getAttribute('data-api-url');
+
+        // Simple pagination state management
+        let currentPage = 1;
+        let isReturningFromDetail = false;
+
         const dataTableOptions = {
             apiEndpoint: apiUrl,
             pageSize: 5,
@@ -293,7 +298,6 @@
                         return data.debiture && data.debiture.name ? `${data.debiture.name}` : '-';
                     },
                 },
-
                 tujuan_penilaian_id: {
                     title: 'Tujuan Penilaian',
                     render: (item, data) => {
@@ -309,12 +313,10 @@
                         }).join(', ');
                     },
                 },
-
                 laporan: {
                     title: 'Status',
                     render: (item, data) => {
                         let badgeClass = '';
-
                         const statusLaporan = data.penilai?.type_penilai || '-';
 
                         switch (statusLaporan.toLowerCase()) {
@@ -343,7 +345,7 @@
                 actions: {
                     title: 'Action',
                     render: (item, data) => {
-                        const status = data.status; // Anggap status berada di dalam objek data
+                        const status = data.status;
                         const dokumenjaminan = data.dokumenjaminan || [];
 
                         return `
@@ -352,29 +354,98 @@
                     ['done'].includes(status) ?
                     dokumenjaminan.map(dokumen => {
                         return `
-                                    <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
-                                    </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-primary" href="surveyor/print-out-inspeksi/${data.id}/${dokumen.id}/${dokumen.jenis_jaminan_id}">
+                                <i class="ki-outline ki-printer"></i>Inspeksi
+                            </a>
+                            <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
                             </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
                             </a>
-
-                                `;
+                        `;
                     }).join('') : ''
                 }
             </div>
         `;
                     }
                 }
-
             },
-
         };
 
         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
         searchInput.addEventListener('input', function() {
@@ -392,7 +463,6 @@
             const branch = branchFilter.value;
             const laporan = Array.from(laporanFilter.selectedOptions).map(option => option.value);
 
-
             let filters = {};
             if (searchInput.value) {
                 filters.search = searchInput.value;
@@ -438,10 +508,8 @@
 
             if (selectedStatuses.length === 0) {
                 dataTable.search('');
-                console.log(selectedStatuses);
             } else {
                 dataTable.search(selectedStatuses.join(','), true);
-                console.log(selectedStatuses);
             }
 
             dataTable.reload();
@@ -451,16 +519,13 @@
             selectAllCheckbox.checked = allChecked;
         }
 
-        // Single export button functionality
+        // Export functionality
         exportButton.addEventListener('click', function(e) {
             e.preventDefault();
 
-            // Check if any rows are selected
             const selectedIds = getSelectedRowIds();
 
-            // Determine export type based on context
             if (selectedIds.length > 0) {
-                // If rows are selected, export those
                 exportData({
                     selected_ids: selectedIds,
                     export_type: 'selected'
@@ -476,14 +541,11 @@
                     export_type: 'filtered'
                 });
             } else if (searchInput.value) {
-                // If only search is applied, export filtered results
                 exportData({
                     search: searchInput.value,
                     export_type: 'filtered'
                 });
-
             } else {
-                // If no selection and no filters, export all
                 exportData({
                     export_type: 'all'
                 });
@@ -491,7 +553,6 @@
         });
 
         function exportData(filters = {}) {
-            // Set filter values in the hidden form
             exportStartDate.value = filters.start_date || '';
             exportEndDate.value = filters.end_date || '';
             exportStatus.value = filters.status ? filters.status.join(',') : '';
@@ -500,7 +561,6 @@
             exportSelectedIds.value = filters.selected_ids ? filters.selected_ids.join(',') : '';
             exportType.value = filters.export_type || 'all';
             exportSearch.value = filters.search || '';
-            // Submit the form
             exportForm.submit();
         }
 
@@ -514,7 +574,12 @@
             const checkboxes = document.querySelectorAll('[data-datatable-row-check="true"]:checked');
             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>
-
-
 @endpush