From a440270b7c5d43e18d5ac9b61686d3113144469b Mon Sep 17 00:00:00 2001
From: Ain Izazi <ain55645@gmail.com>
Date: Tue, 14 Oct 2025 10:44:58 +0800
Subject: [PATCH] add searching di laporan

---
 app/Http/Controllers/AkaunController.php |   2 +-
 resources/js/Akaun/Home.vue              | 313 ++++++++---------------
 2 files changed, 112 insertions(+), 203 deletions(-)

diff --git a/app/Http/Controllers/AkaunController.php b/app/Http/Controllers/AkaunController.php
index 12c1345..02fa01d 100644
--- a/app/Http/Controllers/AkaunController.php
+++ b/app/Http/Controllers/AkaunController.php
@@ -1964,7 +1964,7 @@ public function cetakLaporanAnsuranRangeDate(Request $request){
             }
         }
 
-        return view('akaun.laporan_brgkes', compact('hostname','cawangan_detail','mula_date','hingga_date','tarikh_cetak','api_url','palsu','palsu'));
+        return view('akaun.laporan_brgkes', compact('hostname','cawangan_detail','mula_date','hingga_date','tarikh_cetak','api_url','palsu','status'));
 
     }
     
diff --git a/resources/js/Akaun/Home.vue b/resources/js/Akaun/Home.vue
index 1d1514d..547b9eb 100644
--- a/resources/js/Akaun/Home.vue
+++ b/resources/js/Akaun/Home.vue
@@ -1,205 +1,114 @@
 <template>
-<div class="mx-auto content-center flex justify-center items-center">
-
-    <div class="grid grid-rows-1">
-        <div class="grid grid-cols-3 gap-1 mx-auto">
-
-            <div class="bg-white shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <!-- <router-link to="/akaunhome/imbangduga/extended"> -->
-                <router-link to="/akaunhome/imbangduga/akru">
-                    <img src="/img/balance-sheet.png" class="h-20 w-20 mx-auto" alt="Windster Logo">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Imbang Duga Akru</h2>
-                </router-link>
-            </div>
-
-            <div class="bg-white shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/lejeram">
-                    <img src="/img/ledger.png" class="h-20 w-20 mx-auto" alt="Windster Logo">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Lejer Am</h2>
-                </router-link>
-            </div>
-
-            <div class="bg-white shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/kawalanstok">
-                    <img src="/img/kawalanstok.png" class="h-20 w-30 mx-auto" alt="Windster Logo">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Kawalan Stok</h2>
-                </router-link>
-            </div>
-
-            <div class="bg-white shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/stokaudit">
-                    <img src="/img/audit.png" class="h-20 w-20 mx-auto" alt="Windster Logo">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Stok Audit</h2>
-                </router-link>
-            </div>
-
-            <div class="bg-white shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/stokauditCombine">
-                    <img src="/img/audit.png" class="h-20 w-20 mx-auto" alt="Windster Logo">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Stok Audit Combine</h2>
-                </router-link>
-            </div>
-            <div class="bg-white shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/auditTrail">
-                    <img src="/img/audittrail.png" class="h-20 w-20 mx-auto" alt="Windster Logo">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Audit Trail</h2>
-                </router-link>
-            </div>
-
-
+    <div class="container mx-auto">
+      
+      <div class="flex items-center mb-6">
+        <button
+          id="toggle-search"
+          class="btn btn-outline-secondary mr-2"
+          type="button"
+          @click="toggleSearch">
+          <i class="fa fa-search"></i>
+        </button>
+  
+        <input
+          v-show="showSearch"
+          v-model="searchQuery"
+          type="text"
+          id="search-laporan"
+          class="form-control transition-all duration-300"
+          style="width: 300px; height: 38px;"
+          placeholder="Cari laporan apa ya?"/>
+      </div>
+  
+      
+      <div class="grid grid-cols-3 gap-3">
+        <div
+          v-for="item in filteredMenu"
+          :key="item.title"
+          class="bg-white shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all cursor-pointer">
+          <router-link :to="item.link" class="block text-center">
+            <img
+              v-if="item.img"
+              :src="item.img"
+              class="h-20 w-20 mx-auto mb-2"
+              :alt="item.title"
+            />
+            <h2 class="font-bold text-2xl uppercase">{{ item.title }}</h2>
+          </router-link>
         </div>
-        <br>
-
-        <div class="ml-3 grid grid-cols-3">
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/gadaian">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Pembiayaan</h2>
-                </router-link>
-            </div>
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/penebusan">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Penyelesaian Pembiayaan</h2>
-                </router-link>
-            </div>
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/Pendahuluanserahan">
-                    <h2 class="mx-auto text-center font-bold text-2xl  uppercase">Pendahuluan & Serahan</h2>
-                </router-link>
-            </div>
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/Tuntutbaki">
-                    <h2 class="mx-auto text-center font-bold text-2xl  uppercase">Tuntut Baki</h2>
-                </router-link>
-            </div>
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/ansuran">
-                    <h2 class="mx-auto text-center font-bold text-2xl  uppercase">Ansuran Pembiayaan</h2>
-                </router-link>
-            </div>
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/perbelanjaan">
-                    <h2 class="mx-auto text-center font-bold text-2xl  uppercase">Perbelanjaan</h2>
-                </router-link>
-            </div>
-
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/online">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Online</h2>
-                </router-link>
-            </div>
-
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/upah">
-                    <h2 class="mx-auto text-center font-bold text-2xl  uppercase">Keuntungan</h2>
-                </router-link>
-            </div>
-
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/ringkasanharian">
-                    <h2 class="mx-auto text-center font-bold text-2xl  uppercase">Ringkasan Harian</h2>
-                </router-link>
-            </div>
-        </div>
-
-        <div class="ml-3 grid grid-cols-3">
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/RingkasanTerkumpul">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Ringkasan Terkumpul</h2>
-                </router-link>
-            </div>
-
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/StokAuditBackdate">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Stok Audit Back-date</h2>
-                </router-link>
-            </div>
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/Aging">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Aging</h2>
-                </router-link>
-            </div>
-        </div>
-
-        <div class="ml-3 grid grid-cols-3">
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/PetiBesi">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Peti Besi</h2>
-                </router-link>
-            </div>
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/imbangduga">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Imbang Duga</h2>
-                </router-link>
-            </div>
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                    <router-link to="/akaunhome/prestasi">
-                        <h2 class="mx-auto text-center font-bold text-2xl uppercase">PRESTASI AR-RAHN</h2>
-                    </router-link>
-            </div>
-
-        </div>
-
-        <div class="ml-3 grid grid-cols-3">
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/akrubulan">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Akru Bulanan</h2>
-                </router-link>
-            </div>
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/akrubulanpecahan">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Akru Bulanan Pecahan</h2>
-                </router-link>
-            </div>
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/serahgadai">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Serah Marhun Pembiayaan </h2>
-                </router-link>
-            </div>
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/serahtebus">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Serah Marhun Penyelesaian Pembiayaan</h2>
-                </router-link>
-            </div>
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/tuntutrugi">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Baki Rugi Lelong</h2>
-                </router-link>
-            </div>
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/BilanganPengadai">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Bilangan Pelanggan</h2>
-                </router-link>
-            </div>
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/imbangdugabackup">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Imbang Duga Backup</h2>
-                </router-link>
-            </div>
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/saghilang">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Sag Hilang</h2>
-                </router-link>
-            </div>
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/laporanlelong">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Laporan Lelong</h2>
-                </router-link>
-            </div>
-            <div class="bg-white ml-2 shadow border border-solid px-6 py-4 rounded-lg hover:bg-yellow-300 hover:transition-all mb-2 cursor-pointer">
-                <router-link to="/akaunhome/barangkes">
-                    <h2 class="mx-auto text-center font-bold text-2xl uppercase">Barang Kes</h2>
-                </router-link>
-            </div>
-
-        </div>
-
+      </div>
     </div>
-
-</div>
-</template>
-
-<script>
-export default {
-
-}
-</script>
+  </template>
+  
+  <script>
+  export default {
+    data() {
+      return {
+        showSearch: false,
+        searchQuery: "",
+        menuItems: [
+          { title: "Imbang Duga Akru", link: "/akaunhome/imbangduga/akru", img: "/img/balance-sheet.png" },
+          { title: "Lejer Am", link: "/akaunhome/lejeram", img: "/img/ledger.png" },
+          { title: "Kawalan Stok", link: "/akaunhome/kawalanstok", img: "/img/kawalanstok.png" },
+          { title: "Stok Audit", link: "/akaunhome/stokaudit", img: "/img/audit.png" },
+          { title: "Stok Audit Combine", link: "/akaunhome/stokauditCombine", img: "/img/audit.png" },
+          { title: "Audit Trail", link: "/akaunhome/auditTrail", img: "/img/audittrail.png" },
+          { title: "Pembiayaan", link: "/akaunhome/gadaian" },
+          { title: "Penyelesaian Pembiayaan", link: "/akaunhome/penebusan" },
+          { title: "Pendahuluan & Serahan", link: "/akaunhome/Pendahuluanserahan" },
+          { title: "Tuntut Baki", link: "/akaunhome/Tuntutbaki" },
+          { title: "Ansuran Pembiayaan", link: "/akaunhome/ansuran" },
+          { title: "Perbelanjaan", link: "/akaunhome/perbelanjaan" },
+          { title: "Online", link: "/akaunhome/online" },
+          { title: "Keuntungan", link: "/akaunhome/upah" },
+          { title: "Ringkasan Harian", link: "/akaunhome/ringkasanharian" },
+          { title: "Ringkasan Terkumpul", link: "/akaunhome/RingkasanTerkumpul" },
+          { title: "Stok Audit Back-date", link: "/akaunhome/StokAuditBackdate" },
+          { title: "Aging", link: "/akaunhome/Aging" },
+          { title: "Peti Besi", link: "/akaunhome/PetiBesi" },
+          { title: "Imbang Duga", link: "/akaunhome/imbangduga" },
+          { title: "Prestasi Ar-Rahn", link: "/akaunhome/prestasi" },
+          { title: "Akru Bulanan", link: "/akaunhome/akrubulan" },
+          { title: "Akru Bulanan Pecahan", link: "/akaunhome/akrubulanpecahan" },
+          { title: "Serah Marhun Pembiayaan", link: "/akaunhome/serahgadai" },
+          { title: "Serah Marhun Penyelesaian Pembiayaan", link: "/akaunhome/serahtebus" },
+          { title: "Baki Rugi Lelong", link: "/akaunhome/tuntutrugi" },
+          { title: "Bilangan Pelanggan", link: "/akaunhome/BilanganPengadai" },
+          { title: "Imbang Duga Backup", link: "/akaunhome/imbangdugabackup" },
+          { title: "Sag Hilang", link: "/akaunhome/saghilang" },
+          { title: "Laporan Lelong", link: "/akaunhome/laporanlelong" },
+          { title: "Barang Kes", link: "/akaunhome/barangkes" },
+        ],
+      };
+    },
+    computed: {
+      filteredMenu() {
+        const q = this.searchQuery.toLowerCase();
+        return this.menuItems.filter((item) =>
+          item.title.toLowerCase().includes(q)
+        );
+      },
+    },
+    methods: {
+      toggleSearch() {
+        this.showSearch = !this.showSearch;
+        if (this.showSearch) {
+          this.$nextTick(() => {
+            document.getElementById("search-laporan").focus();
+          });
+        }
+      },
+    },
+  };
+  </script>
+  
+  <style scoped>
+  .btn {
+    height: 38px;
+    border: 1px solid #ccc;
+    background: white;
+    padding: 0 10px;
+    border-radius: 6px;
+  }
+  </style>
+  
\ No newline at end of file