Abizrh
58 lines
2.0 KiB
Vue
58 lines
2.0 KiB
Vue
<script setup lang="ts">
|
|
import ListProsedur from './sep-prosedur/list.vue'
|
|
|
|
const tabs = [
|
|
{ value: 'sep-prosedur', label: 'Sep Prosedur', component: ListProsedur },
|
|
{ value: 'konsultasi', label: 'Konsultasi' },
|
|
{ value: 'surat', label: 'Surat Kontrol' },
|
|
{ value: 'catatan', label: 'Catatan Perkembangan Pasien' },
|
|
{ value: 'medis', label: 'Pengkajian Awal Medis & Asesmen Fungsi' },
|
|
{ value: 'keperawatan', label: 'Pengkajian Awal Keperawatan' },
|
|
{ value: 'protokol', label: 'Protokol Terapi' },
|
|
{ value: 'tindakan', label: 'Tindakan' },
|
|
{ value: 'obat', label: 'Order Obat' },
|
|
{ value: 'bmhp', label: 'Order BMHP & Alkes' },
|
|
{ value: 'radiologi', label: 'Pemeriksaan Radiologi' },
|
|
{ value: 'labpk', label: 'Pemeriksaan Lab PK' },
|
|
{ value: 'labmikro', label: 'Order Lab Mikro' },
|
|
{ value: 'labpa', label: 'Order Lab PA' },
|
|
{ value: 'ambulance', label: 'Ambulance' },
|
|
{ value: 'resume', label: 'Resume' },
|
|
]
|
|
</script>
|
|
|
|
<template>
|
|
<Tabs default-value="sep-prosedur" class="w-full">
|
|
<div class="scrollbar-hide overflow-x-auto">
|
|
<TabsList class="inline-flex gap-2 whitespace-nowrap bg-transparent p-2">
|
|
<TabsTrigger
|
|
v-for="tab in tabs"
|
|
:key="tab.value"
|
|
:value="tab.value"
|
|
class="flex-shrink-0 rounded-full px-4 py-2 text-sm font-medium data-[state=active]:bg-green-600 data-[state=inactive]:bg-gray-100 data-[state=active]:text-white data-[state=inactive]:text-gray-700"
|
|
>
|
|
{{ tab.label }}
|
|
</TabsTrigger>
|
|
</TabsList>
|
|
</div>
|
|
|
|
<div class="mt-4">
|
|
<TabsContent v-for="tab in tabs" :key="`content-${tab.value}`" :value="tab.value">
|
|
<div class="rounded-md border p-4">
|
|
<component :is="tab.component" v-bind="tab.props || {}" :label="tab.label" />
|
|
</div>
|
|
</TabsContent>
|
|
</div>
|
|
</Tabs>
|
|
</template>
|
|
|
|
<style>
|
|
.scrollbar-hide::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
.scrollbar-hide {
|
|
-ms-overflow-style: none;
|
|
scrollbar-width: none;
|
|
}
|
|
</style>
|