Squashed commit of the following:

commit bcfb4c1456 Merge: 1cbde57 975c87d Author: Munawwirul Jamal <[email protected]> Date: Mon Nov 17 11:15:14 2025 +0700 Merge pull request #147 from dikstub-rssa/feat/surat-kontrol-135 Feat: Integration Rehab Medik - Surat Kontrol commit 975c87d99a Merge: f582090 1cbde57 Author: hasyim_kai <[email protected]> Date: Mon Nov 17 10:58:10 2025 +0700 Merge branch 'dev' into feat/surat-kontrol-135 commit f582090d18 Author: hasyim_kai <[email protected]> Date: Thu Nov 13 11:56:21 2025 +0700 Fix: Refactor surat kontrol commit a14c4a5d3c Author: hasyim_kai <[email protected]> Date: Tue Nov 11 14:21:58 2025 +0700 Fix: Refactor Surat Kontrol CRUD {id} to {code} commit 24313adef6 Author: hasyim_kai <[email protected]> Date: Fri Nov 7 10:35:46 2025 +0700 Fix: debug back btn in add, edit, detail content page commit 59b44b5729 Merge: 99a61a0 db15ec9 Author: Muhammad Hasyim Chaidir Ali <[email protected]> Date: Fri Nov 7 09:11:10 2025 +0700 Merge branch 'dev' into feat/surat-kontrol-135 commit 99a61a0bf2 Author: hasyim_kai <[email protected]> Date: Thu Nov 6 08:06:01 2025 +0700 Feat: add right & bottom label in input base component commit db48919325 Author: hasyim_kai <[email protected]> Date: Wed Nov 5 13:53:43 2025 +0700 Feat: add banner in List if requirement not met commit bd57250f7e Author: hasyim_kai <[email protected]> Date: Wed Nov 5 13:26:48 2025 +0700 Fix: refactor getDetail url param commit a361922e32 Author: hasyim_kai <[email protected]> Date: Wed Nov 5 13:19:07 2025 +0700 Feat: Add & integrate add, edit, detail page commit 331f4a6b20 Author: hasyim_kai <[email protected]> Date: Tue Nov 4 16:56:08 2025 +0700 Feat: Integrate Control Letter commit 2275f4dc99 Author: hasyim_kai <[email protected]> Date: Mon Oct 27 14:01:58 2025 +0700 Feat: add UI BPJS > Surat Kontrol commit 89e0e7a2c8 Author: hasyim_kai <[email protected]> Date: Mon Oct 27 10:21:59 2025 +0700 Feat: add UI CRUD Surat Kontrol at Rehab Medik > kunjungan > Proses
2025-11-18 12:58:58 +07:00
parent dc0bcc3606
commit c98018bb4e
47 changed files with 2696 additions and 31 deletions
@@ -0,0 +1,85 @@
+<script setup lang="ts">
+import { Calendar as CalendarIcon, Filter as FilterIcon, Search } from 'lucide-vue-next'
+import { ref } from 'vue'
+import type { Ref } from 'vue'
+import type { DateRange } from 'radix-vue'
+import { CalendarDate, DateFormatter, getLocalTimeZone } from '@internationalized/date'
+import { cn } from '~/lib/utils'
+import type { HeaderPrep, RefExportNav, RefSearchNav } from '~/components/pub/my-ui/data/types'
+
+const props = defineProps<{
+  prep: HeaderPrep
+  refSearchNav?: RefSearchNav
+  enableExport?: boolean
+  refExportNav?: RefExportNav
+}>()
+
+// function emitSearchNavClick() {
+//   props.refSearchNav?.onClick()
+// }
+//
+// function onInput(event: Event) {
+//   props.refSearchNav?.onInput((event.target as HTMLInputElement).value)
+// }
+//
+// function btnClick() {
+//   props.prep?.addNav?.onClick?.()
+// }
+
+const searchQuery = ref('')
+const dateRange = ref<{ from: Date | null; to: Date | null }>({
+  from: new Date(),
+  to: new Date(),
+})
+
+const df = new DateFormatter('en-US', {
+  dateStyle: 'medium',
+})
+
+const value = ref({
+  start: new CalendarDate(2022, 1, 20),
+  end: new CalendarDate(2022, 1, 20).add({ days: 20 }),
+}) as Ref<DateRange>
+
+function onFilterClick() {
+  console.log('Search:', searchQuery.value)
+  console.log('Date Range:', dateRange.value)
+  props.refSearchNav?.onClick()
+}
+</script>
+
+<template>
+  <header>
+    <div class="flex items-center gap-2 mb-4 2xl:mb-5">
+      
+      <Button variant="outline" class="border-orange-500 text-orange-600 hover:bg-orange-50" @click="onFilterClick">
+        <FilterIcon class="mr-2 size-4" />
+        Filter
+      </Button>
+
+      <DropdownMenu v-show="props.enableExport">
+        <DropdownMenuTrigger as-child>
+          <Button variant="outline" class="ml-auto border-orange-500 text-orange-600 hover:bg-orange-50">
+            <Icon name="i-lucide-download" class="h-4 w-4" />
+            Ekspor
+          </Button>
+        </DropdownMenuTrigger>
+        <DropdownMenuContent>
+          <DropdownMenuItem v-show="props.refExportNav?.onExportPdf"
+                            @click="props.refExportNav?.onExportPdf">
+                            Ekspor PDF
+          </DropdownMenuItem>
+          <DropdownMenuItem v-show="props.refExportNav?.onExportCsv"
+                            @click="props.refExportNav?.onExportCsv">
+                            Ekspor CSV
+          </DropdownMenuItem>
+          <DropdownMenuItem v-show="props.refExportNav?.onExportExcel"
+                            @click="props.refExportNav?.onExportExcel">
+                            Ekspor Excel
+          </DropdownMenuItem>
+        </DropdownMenuContent>
+      </DropdownMenu>
+      
+    </div>
+  </header>
+</template>
@@ -5,11 +5,13 @@ import type { Ref } from 'vue'
 import type { DateRange } from 'radix-vue'
 import { CalendarDate, DateFormatter, getLocalTimeZone } from '@internationalized/date'
 import { cn } from '~/lib/utils'
-import type { HeaderPrep, RefSearchNav } from '~/components/pub/my-ui/data/types'
+import type { HeaderPrep, RefExportNav, RefSearchNav } from '~/components/pub/my-ui/data/types'

 const props = defineProps<{
  prep: HeaderPrep
  refSearchNav?: RefSearchNav
+  enableExport?: boolean
+  refExportNav?: RefExportNav
 }>()

 // function emitSearchNavClick() {
@@ -57,7 +59,7 @@ function onFilterClick() {

 <template>
  <header>
-    <div class="flex items-center space-x-2 mb-4 2xl:mb-5">
+    <div class="flex items-center gap-2 mb-4 2xl:mb-5">
      <div class="relative w-64">
        <Search class="absolute left-3 top-1/2 size-4 -translate-y-1/2 text-gray-400" />
        <Input v-model="searchQuery" type="text" placeholder="Cari Nama /No.RM" class="pl-9" />
@@ -97,6 +99,30 @@ function onFilterClick() {
        <FilterIcon class="mr-2 size-4" />
        Filter
      </Button>
+
+      <DropdownMenu v-show="props.enableExport">
+        <DropdownMenuTrigger as-child>
+          <Button variant="outline" class="ml-auto border-orange-500 text-orange-600 hover:bg-orange-50">
+            <Icon name="i-lucide-download" class="h-4 w-4" />
+            Ekspor
+          </Button>
+        </DropdownMenuTrigger>
+        <DropdownMenuContent>
+          <DropdownMenuItem v-show="props.refExportNav?.onExportPdf"
+                            @click="props.refExportNav?.onExportPdf">
+                            Ekspor PDF
+          </DropdownMenuItem>
+          <DropdownMenuItem v-show="props.refExportNav?.onExportCsv"
+                            @click="props.refExportNav?.onExportCsv">
+                            Ekspor CSV
+          </DropdownMenuItem>
+          <DropdownMenuItem v-show="props.refExportNav?.onExportExcel"
+                            @click="props.refExportNav?.onExportExcel">
+                            Ekspor Excel
+          </DropdownMenuItem>
+        </DropdownMenuContent>
+      </DropdownMenu>
+      
    </div>
  </header>
 </template>