Add new galeri marhun to cawangan

resources/js/components/pengurusangambar/marhun/SelectBatchLelongCawangan.vue

@@ -0,0 +1,52 @@
+<template>
+    <label>Pilih Batch Lelong</label>
+    <div class="d-flex">
+        <select class="custom-select" @change="pilihBatchLelong($event)">
+            <option selected>Batch Lelong</option>
+            <option v-for="val in listLelong" :key="val" v-bind:value="val.id">{{ val.id }}, ({{ val.tarikh_lelong }})
+            </option>
+        </select>
+        <button class="btn btn-primary d-flex" @click="reloadComponent()">Kemaskini <span class="material-symbols-rounded">refresh</span></button>
+    </div>
+    <div class="mt-3 row justify-content-center">
+        <DisplayLelongBid v-if="pilihLelong != 'Batch Lelong'" v-bind:key="componentKeySecond"
+            v-bind:selectedIdCawangan="pilihIdCawangan" v-bind:selectedBatchLelong="pilihLelong" />
+    </div>
+</template>
+
+<script setup>
+import { ref, onMounted } from "vue";
+import DisplayLelongBid from "./DisplayLelongBid.vue.vue"
+import axios from "axios";
+
+const listLelong = ref();
+const pilihLelong = ref('Batch Lelong');
+const pilihIdCawangan = ref(branch_code);
+const componentKeySecond = ref(0);
+
+function getListLelongByCawangan() {
+    axios.get("/listLelongByCawangan", {
+        params: {
+            caw_id: branch_code,
+        },
+    }).then((response) => {
+        listLelong.value = response.data;
+    }).catch((error) => {
+        alert(error);
+    });
+};
+
+function pilihBatchLelong(e) {
+    let val = e.target.value;
+    pilihLelong.value = val;
+    componentKeySecond.value += 1;
+};
+
+function reloadComponent() {
+    componentKeySecond.value += 1;
+}
+
+onMounted(() => {
+    getListLelongByCawangan();
+})
+</script>

resources/js/vue-app.js

@@ -4,8 +4,13 @@ import 'viewerjs/dist/viewer.css'
 import VueViewer from 'v-viewer'
 
 import SelectBatchLelong from "./components/pengurusangambar/marhun/SelectBatchLelong.vue"
+import SelectBatchLelongCawangan from "./components/pengurusangambar/marhun/SelectBatchLelongCawangan.vue"
 
 const appSelectBatchLelong = createApp(SelectBatchLelong);
 appSelectBatchLelong.use(VueViewer);
 
-appSelectBatchLelong.mount("#appSelectBatchLelong");
+const appSelectBatchLelongCawangan = createApp(SelectBatchLelongCawangan);
+appSelectBatchLelongCawangan.use(VueViewer);
+
+appSelectBatchLelong.mount("#appSelectBatchLelong");
+appSelectBatchLelongCawangan.mount("#appSelectBatchLelongCawangan");