From 9647cfa3ff4db7a4c851a2ca934514ef15e11a0a Mon Sep 17 00:00:00 2001
From: riefive <rie.five@gmail.com>
Date: Mon, 20 Oct 2025 14:14:17 +0700
Subject: [PATCH] feat(sep): integrate visit sep

---
 app/components/app/sep/entry-form.vue         | 14 +++---
 app/components/app/sep/list-cfg.visit.ts      | 46 +++++++++++++++++++
 app/components/app/sep/list-visit.vue         | 36 +++++++++++++++
 ...st-history-dialog.vue => view-history.vue} |  0
 app/components/content/sep/entry.vue          | 45 ++++++++++++++++--
 .../vclaim-health-facility.service.ts         | 23 ++++++++++
 6 files changed, 154 insertions(+), 10 deletions(-)
 create mode 100644 app/components/app/sep/list-cfg.visit.ts
 create mode 100644 app/components/app/sep/list-visit.vue
 rename app/components/app/sep/{list-history-dialog.vue => view-history.vue} (100%)
 create mode 100644 app/services/vclaim-health-facility.service.ts

diff --git a/app/components/app/sep/entry-form.vue b/app/components/app/sep/entry-form.vue
index f98d4caa..aa4507e3 100644
--- a/app/components/app/sep/entry-form.vue
+++ b/app/components/app/sep/entry-form.vue
@@ -24,6 +24,7 @@ const props = defineProps<{
   isLoading?: boolean
   isReadonly?: boolean
   doctors: any[]
+  facilities: any[]
   patient?: PatientEntity | null | undefined
   values?: any
 }>()
@@ -287,14 +288,15 @@ watch(props, (value) => {
             <span class="text-red-500">*</span>
           </Label>
           <Field :errMessage="errors.destinationClinic">
-            <Select
-              id="destinationClinic"
-              icon-name="i-lucide-chevron-down"
+            <Combobox
+              id="attendingDoctor"
               v-model="destinationClinic"
               v-bind="destinationClinicAttrs"
-              :items="items"
-              :disabled="isLoading || isReadonly"
-              placeholder="Pilih klinik"
+              :items="facilities"
+              :is-disabled="isLoading || isReadonly"
+              placeholder="Pilih Klinik"
+              search-placeholder="Cari Klinik"
+              empty-message="Item tidak ditemukan"
             />
           </Field>
         </Cell>
diff --git a/app/components/app/sep/list-cfg.visit.ts b/app/components/app/sep/list-cfg.visit.ts
new file mode 100644
index 00000000..83b16d3b
--- /dev/null
+++ b/app/components/app/sep/list-cfg.visit.ts
@@ -0,0 +1,46 @@
+import type { Config } from '~/components/pub/my-ui/data-table'
+
+export interface SepVisitData {
+  letterNumber: string
+  letterDate: string
+  sepNumber: string
+  patientName: string
+  bpjsNumber: string
+  clinic: string
+  doctor: string
+}
+
+export const config: Config = {
+  cols: [
+    { width: 100 },
+    { width: 100 },
+    { width: 100 },
+    { width: 100 },
+    { width: 100 },
+    { width: 100 },
+    { width: 100 },
+    { width: 100 },
+  ],
+
+  headers: [
+    [
+      { label: 'NO. SURAT KONTROL' },
+      { label: 'TGL RENCANA KONTROL' },
+      { label: 'NO. SEP' },
+      { label: 'NAMA PASIEN' },
+      { label: 'NO. KARTU BPJS' },
+      { label: 'KLINIK' },
+      { label: 'DOKTER' },
+    ],
+  ],
+
+  keys: ['letterNumber', 'letterDate', 'sepNumber', 'patientName', 'bpjsNumber', 'clinic', 'doctor'],
+
+  delKeyNames: [{ key: 'code', label: 'Kode' }],
+
+  parses: {},
+
+  components: {},
+
+  htmls: {},
+}
diff --git a/app/components/app/sep/list-visit.vue b/app/components/app/sep/list-visit.vue
new file mode 100644
index 00000000..fdad0791
--- /dev/null
+++ b/app/components/app/sep/list-visit.vue
@@ -0,0 +1,36 @@
+<script setup lang="ts">
+// Components
+import PaginationView from '~/components/pub/my-ui/pagination/pagination-view.vue'
+
+// Types
+import type { SepHistoryData } from './list-cfg.history'
+import type { PaginationMeta } from '~/components/pub/my-ui/pagination/pagination.type'
+
+// Configs
+import { config } from './list-cfg.history'
+
+const props = defineProps<{
+  data: SepHistoryData[]
+  paginationMeta?: PaginationMeta
+}>()
+
+const emit = defineEmits<{
+  pageChange: [page: number]
+}>()
+
+function handlePageChange(page: number) {
+  emit('pageChange', page)
+}
+</script>
+
+<template>
+  <PubMyUiDataTable
+    v-bind="config"
+    :rows="props.data"
+  />
+  <PaginationView
+    v-if="paginationMeta"
+    :pagination-meta="paginationMeta"
+    @page-change="handlePageChange"
+  />
+</template>
diff --git a/app/components/app/sep/list-history-dialog.vue b/app/components/app/sep/view-history.vue
similarity index 100%
rename from app/components/app/sep/list-history-dialog.vue
rename to app/components/app/sep/view-history.vue
diff --git a/app/components/content/sep/entry.vue b/app/components/content/sep/entry.vue
index 3637c82b..3645cfa5 100644
--- a/app/components/content/sep/entry.vue
+++ b/app/components/content/sep/entry.vue
@@ -2,12 +2,13 @@
 import { ref, onMounted } from 'vue'
 
 // Components
-import AppListHistoryDialog from '~/components/app/sep/list-history-dialog.vue'
+import AppViewHistory from '~/components/app/sep/view-history.vue'
 
 // Types
 import type { PaginationMeta } from '~/components/pub/my-ui/pagination/pagination.type'
 import type { PatientEntity } from '~/models/patient'
 import type { SepHistoryData } from '~/components/app/sep/list-cfg.history'
+import type { SepVisitData } from '~/components/app/sep/list-cfg.visit'
 
 // Services
 import { getPatientDetail, getPatients } from '~/services/patient.service'
@@ -15,6 +16,7 @@ import { getList as getProvinceList } from '~/services/vclaim-region-province.se
 import { getList as getCityList } from '~/services/vclaim-region-city.service'
 import { getList as getDistrictList } from '~/services/vclaim-region-district.service'
 import { getValueLabelList as getDoctorLabelList } from '~/services/vclaim-doctor.service'
+import { getValueLabelList as getHealthFacilityLabelList } from '~/services/vclaim-health-facility.service'
 import { getList as getDiagnoseReferralList } from '~/services/vclaim-diagnose-referral.service'
 import { getList as geMonitoringVisitList } from '~/services/vclaim-monitoring-visit.service'
 import { getList as getMonitoringHistoryList } from '~/services/vclaim-monitoring-history.service'
@@ -26,10 +28,11 @@ const selectedPatient = ref('')
 const selectedPatientObject = ref<PatientEntity | null>(null)
 const selectedLetter = ref('SK22334442')
 const histories = ref<Array<SepHistoryData>>([])
+const visits = ref<Array<SepVisitData>>([])
 
-// patients used by AppSepTableSearchPatient (will be filled from API)
 const patients = ref<Array<{ id: string; identity: string; number: string; bpjs: string; name: string }>>([])
 const doctors = ref<Array<{ value: string | number; label: string }>>([])
+const facilities = ref<Array<{ value: string | number; label: string }>>([])
 const isPatientsLoading = ref(false)
 const paginationMeta = ref<PaginationMeta>({
   recordCount: 0,
@@ -101,7 +104,14 @@ async function getPatientCurrent(id: string) {
 
 async function getMonitoringHistoryMappers() {
   histories.value = []
-  const result = await getMonitoringHistoryList({ nop: '0002078925513', tglawal: '2025-07-20', tglakhir: '2025-10-10' })
+  const dateFirst = new Date()
+  const dateLast = new Date()
+  dateLast.setMonth(dateFirst.getMonth() - 3)
+  const result = await getMonitoringHistoryList({
+    nop: '0002078925513',
+    tglawal: dateFirst.toISOString().substring(0, 10),
+    tglakhir: dateLast.toISOString().substring(0, 10),
+  })
   if (result && result.success && result.body) {
     const historiesRaw = result.body?.response?.histori || []
     if (!historiesRaw) return
@@ -121,6 +131,31 @@ async function getMonitoringHistoryMappers() {
   }
 }
 
+async function getMonitoringVisitMappers() {
+  visits.value = []
+  const dateFirst = new Date()
+  const result = await geMonitoringVisitList({
+    nop: '0002078925513',
+    tglpelayanan: dateFirst.toISOString().substring(0, 10),
+    jnspelayanan: 1,
+  })
+  if (result && result.success && result.body) {
+    const visitsRaw = result.body?.response?.visit || []
+    if (!visitsRaw) return
+    visitsRaw.forEach((result: any) => {
+      visits.value.push({
+        letterNumber: result.noSuratKontrol,
+        letterDate: result.tglRencanaKontrol,
+        sepNumber: result.noSep,
+        patientName: result.namaPasien,
+        bpjsNumber: result.noKartuBPJS,
+        clinic: '-',
+        doctor: '-',
+      })
+    })
+  }
+}
+
 const letters = [
   {
     noSurat: 'SK22334442',
@@ -188,6 +223,7 @@ onMounted(async () => {
     'tgl-pelayanan': new Date().toISOString().substring(0, 10),
     'kode-spesialis': 0,
   })
+  facilities.value = await getHealthFacilityLabelList({ faskes: 'Puskesmas', 'jenis-faskes': 1 })
   getProvinceList().then((value) => {
     console.log('value:', value)
   })
@@ -220,6 +256,7 @@ onMounted(async () => {
   </div>
   <AppSepEntryForm
     :doctors="doctors"
+    :facilities="facilities"
     :patient="selectedPatientObject"
     @event="handleEvent"
   />
@@ -237,7 +274,7 @@ onMounted(async () => {
     :letters="letters"
     @save="handleSaveLetter"
   />
-  <AppListHistoryDialog
+  <AppViewHistory
     v-model:open="openHistory"
     :histories="histories"
   />
diff --git a/app/services/vclaim-health-facility.service.ts b/app/services/vclaim-health-facility.service.ts
new file mode 100644
index 00000000..f3bc2ff3
--- /dev/null
+++ b/app/services/vclaim-health-facility.service.ts
@@ -0,0 +1,23 @@
+// Base
+import * as base from './_crud-base'
+
+const path = '/api/vclaim/referensi/faskes'
+const name = 'faskes'
+
+export function getList(params: any = null) {
+  return base.getList(path, params, name)
+}
+
+export async function getValueLabelList(params: any = null): Promise<{ value: string; label: string }[]> {
+  let data: { value: string; label: string }[] = []
+  const result = await getList(params)
+  if (result.success) {
+    const resultData = result.body?.response?.faskes || []
+    const resultUnique = [...new Map(resultData.map((item: any) => [item.kode, item])).values()]
+    data = resultUnique.map((item: any) => ({
+      value: item.kode ? String(item.kode) : '',
+      label: item.nama,
+    }))
+  }
+  return data
+}