84 lines
2.4 KiB
Vue
84 lines
2.4 KiB
Vue
<script setup lang="ts">
|
|
//
|
|
import { computed } from 'vue'
|
|
import { useRoute, useRouter } from 'vue-router'
|
|
|
|
import { getDetail } from '~/services/encounter.service'
|
|
|
|
//
|
|
import type { TabItem } from '~/components/pub/my-ui/comp-tab/type'
|
|
import CompTab from '~/components/pub/my-ui/comp-tab/comp-tab.vue'
|
|
|
|
// PLASE ORDER BY TAB POSITION
|
|
import ProtocolList from '~/components/app/chemotherapy/list.protocol.vue'
|
|
import MedicineProtocolList from '~/components/app/chemotherapy/list.medicine.vue'
|
|
|
|
const route = useRoute()
|
|
const router = useRouter()
|
|
|
|
// activeTab selalu sinkron dengan query param
|
|
const activeTab = computed({
|
|
get: () => (route.query?.tab && typeof route.query.tab === 'string' ? route.query.tab : 'chemotherapy-protocol'),
|
|
set: (val: string) => {
|
|
router.replace({ path: route.path, query: { tab: val } })
|
|
},
|
|
})
|
|
|
|
const id = typeof route.params.id == 'string' ? parseInt(route.params.id) : 0
|
|
const dataRes = await getDetail(id, {
|
|
includes:
|
|
'patient,patient-person,patient-person-addresses,unit,Appointment_Doctor,Appointment_Doctor-employee,Appointment_Doctor-employee-person',
|
|
})
|
|
const dataResBody = dataRes.body ?? null
|
|
const data = dataResBody?.data ?? null
|
|
|
|
// Dummy rows for ProtocolList (matches keys expected by list-cfg.protocol)
|
|
const protocolRows = [
|
|
{
|
|
number: '1',
|
|
tanggal: new Date().toISOString().substring(0, 10),
|
|
siklus: 'I',
|
|
periode: 'Siklus I',
|
|
kehadiran: 'Hadir',
|
|
action: '',
|
|
},
|
|
{
|
|
number: '2',
|
|
tanggal: new Date().toISOString().substring(0, 10),
|
|
siklus: 'II',
|
|
periode: 'Siklus II',
|
|
kehadiran: 'Tidak Hadir',
|
|
action: '',
|
|
},
|
|
]
|
|
|
|
const paginationMeta = {
|
|
recordCount: protocolRows.length,
|
|
page: 1,
|
|
pageSize: 10,
|
|
totalPage: 1,
|
|
hasNext: false,
|
|
hasPrev: false,
|
|
}
|
|
|
|
const tabs: TabItem[] = [
|
|
{ value: 'chemotherapy-protocol', label: 'Protokol Kemoterapi', component: ProtocolList, props: { data: protocolRows, paginationMeta } },
|
|
{ value: 'chemotherapy-medicine', label: 'Protokol Obat Kemoterapi', component: MedicineProtocolList, props: { data: protocolRows, paginationMeta } },
|
|
]
|
|
</script>
|
|
|
|
<template>
|
|
<div class="w-full">
|
|
<div class="mb-4">
|
|
<PubMyUiNavContentBa label="Kembali ke Daftar Kunjungan" />
|
|
</div>
|
|
<AppEncounterQuickInfo :data="data" />
|
|
<CompTab
|
|
:data="tabs"
|
|
:initial-active-tab="activeTab"
|
|
@change-tab="activeTab = $event"
|
|
/>
|
|
</div>
|
|
</template>
|
|
|