<script setup lang="ts">
import { useRouter } from 'vue-router'
import { withBase } from '~/models/_base'
import type { HeaderPrep } from '~/components/pub/my-ui/data/types'
import type { Patient } from '~/models/patient'
import type { Person } from '~/models/person'
import { getDetail } from '~/services/surgery-report.service'

// Components
import Header from '~/components/pub/my-ui/nav-header/prep.vue'
import type { SurgeryReport } from '~/models/surgery-report'

// #region Props & Emits
const props = withDefaults(defineProps<{ 
  encounter_id: number
  record_id: number 
}>(), {
  
})

// #endregion

// #region State & Computed

const router = useRouter()
const surgeryReport = ref<SurgeryReport | null>(null)

const headerPrep: HeaderPrep = {
  title: 'Detail Laporan Operasi',
  icon: 'i-lucide-newspaper',
}

// #endregion

// #region Lifecycle Hooks
// onMounted(async () => {
//   const result = await getDetail(props.record_id, {
//     includes: "unit,specialist,subspecialist,doctor-employee-person",
//   })
//   if (result.success) {
//     surgeryReport.value = result.body?.data
//   }
// })
// #endregion

// #region Functions
function goBack() {
  router.go(-1)
}

// #endregion region

// #region Utilities & event handlers
function handleAction() {
  goBack()
}
// #endregion

// #region Watchers
// #endregion
</script>

<template>
  <Header :prep="headerPrep" :ref-search-nav="headerPrep.refSearchNav" />
  <AppSurgeryReportDetail :instance="surgeryReport" @click="handleAction" />
</template>
