feat (soapi): introduce early rehab and function forms

This commit is contained in:
Abizrh
2025-10-11 21:33:08 +07:00
parent 867c1b4e9e
commit bf5109c457
6 changed files with 920 additions and 231 deletions
+314 -61
View File
@@ -1,5 +1,4 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref } from 'vue'
import Block from '~/components/pub/my-ui/doc-entry/block.vue' import Block from '~/components/pub/my-ui/doc-entry/block.vue'
import Cell from '~/components/pub/my-ui/doc-entry/cell.vue' import Cell from '~/components/pub/my-ui/doc-entry/cell.vue'
import Field from '~/components/pub/my-ui/doc-entry/field.vue' import Field from '~/components/pub/my-ui/doc-entry/field.vue'
@@ -9,6 +8,8 @@ const props = defineProps<{
excludeFields?: string[] excludeFields?: string[]
}>() }>()
const emits = defineEmits(['click'])
const subject = ref({ const subject = ref({
'prim-compl': '', 'prim-compl': '',
'sec-compl': '', 'sec-compl': '',
@@ -25,77 +26,329 @@ const isExcluded = (key: string) => props.excludeFields?.includes(key)
</script> </script>
<template> <template>
<div class="space-y-4"> <form id="entry-form">
<!-- Keluhan Utama --> <div class="mb-5 border-b border-b-slate-300 pb-3 text-lg xl:text-xl">
<Cell v-if="!isExcluded('prim-compl')"> <div>
<h1 class="font-semibold">Pemeriksaan Fisiatrik</h1>
<span class="text-sm font-semibold">Anamnesa</span>
</div>
<div class="my-2 rounded-md border border-slate-300 p-4">
<Block>
<Cell>
<Label dynamic>Keluhan Utama</Label> <Label dynamic>Keluhan Utama</Label>
<Field> <Field>
<Textarea placeholder="Masukkan anamnesa pasien" v-model="subject['prim-compl']" /> <Textarea />
</Field>
</Cell>
</Block>
<Block :colCount="3">
<Cell>
<Label dynamic>Diagnosa Medis</Label>
<Field>
<Textarea />
</Field> </Field>
</Cell> </Cell>
<!-- Keluhan Tambahan --> <Cell>
<Cell v-if="!isExcluded('sec-compl')"> <Label dynamic>Rencana Awal Medis</Label>
<Label dynamic>Keluhan Tambahan</Label>
<Field> <Field>
<Textarea placeholder="Masukkan keluhan tambahan" v-model="subject['sec-compl']" /> <Textarea />
</Field> </Field>
</Cell> </Cell>
<!-- Riwayat Penyakit Sekarang --> <Cell>
<Cell v-if="!isExcluded('cur-disea-hist')"> <Label dynamic>Terapi</Label>
<Label dynamic>Riwayat Penyakit Sekarang</Label>
<Field> <Field>
<Textarea placeholder="Masukkan riwayat penyakit sekarang" v-model="subject['cur-disea-hist']" /> <Textarea />
</Field>
</Cell>
<!-- Riwayat Penyakit Dahulu -->
<Cell v-if="!isExcluded('pas-disea-hist')">
<Label dynamic>Riwayat Penyakit Dahulu</Label>
<Field>
<Textarea placeholder="Masukkan riwayat penyakit dahulu" v-model="subject['pas-disea-hist']" />
</Field>
</Cell>
<!-- Riwayat Penyakit Keluarga -->
<Cell v-if="!isExcluded('fam-disea-hist')">
<Label dynamic>Riwayat Penyakit Keluarga</Label>
<Field>
<Textarea placeholder="Masukkan riwayat penyakit keluarga" v-model="subject['fam-disea-hist']" />
</Field>
</Cell>
<!-- Riwayat Alergi -->
<Cell v-if="!isExcluded('alg-hist')">
<Label dynamic>Riwayat Alergi</Label>
<Field>
<Textarea placeholder="Masukkan riwayat alergi" v-model="subject['alg-hist']" />
</Field>
</Cell>
<!-- Reaksi Alergi -->
<Cell v-if="!isExcluded('alg-react')">
<Label dynamic>Reaksi Alergi</Label>
<Field>
<Textarea placeholder="Masukkan reaksi alergi" v-model="subject['alg-react']" />
</Field>
</Cell>
<!-- Pengobatan yang Sedang Dijalani -->
<Cell v-if="!isExcluded('med-hist')">
<Label dynamic>Riwayat Pengobatan</Label>
<Field>
<Textarea placeholder="Masukkan pengobatan yang sedang dijalani" v-model="subject['med-hist']" />
</Field>
</Cell>
<!-- Golongan Darah -->
<Cell v-if="!isExcluded('blood-type')">
<Label dynamic>Golongan Darah</Label>
<Field>
<Input type="text" placeholder="Masukkan golongan darah" v-model="subject['blood-type']" />
</Field> </Field>
</Cell> </Cell>
</Block>
</div> </div>
<Separator class="mt-8" />
<div class="my-2">
<h1 class="font-semibold">Pemeriksaan Fisik</h1>
<span class="text-sm font-semibold">Status Generalis</span>
</div>
<div class="my-2 rounded-md border border-slate-300 p-4">
<Block :colCount="3">
<Cell>
<Label dynamic>Tekanan Darah</Label>
<Field>
<Input placeholder="Sistolik" />
<Input placeholder="Diastolik" />
</Field>
</Cell>
<Cell>
<Label dynamic>Nadi</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>GCS</Label>
<Field>
<Input />
</Field>
</Cell>
</Block>
<Block :colCount="3">
<Cell>
<Label dynamic>RR</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>Ambulasi</Label>
<Field>
<RadioGroup class="flex gap-4">
<div class="flex items-center space-x-2">
<RadioGroupItem
id="vaksin-yes"
value="yes"
/>
<Label for="vaksin-yes">Dependent</Label>
</div>
<div class="flex items-center space-x-2">
<RadioGroupItem
id="vaksin-no"
value="no"
/>
<Label for="vaksin-no">Independen</Label>
</div>
</RadioGroup>
</Field>
</Cell>
<Cell>
<Label dynamic>Gait</Label>
<Field>
<Textarea />
</Field>
</Cell>
</Block>
</div>
<div class="my-2">
<span class="text-sm font-semibold">Status Neurologis</span>
</div>
<div class="my-2 rounded-md border border-slate-300 p-4">
<Block :colCount="3">
<Cell>
<Label dynamic>N. Cranialis</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>Sensoris</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>Reflek Fisilogis</Label>
<Field>
<Input />
</Field>
</Cell>
</Block>
<Block :colCount="2">
<Cell>
<Label dynamic>Reflek Patologis</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>Saraf Otonom</Label>
<Field>
<Input />
</Field>
</Cell>
</Block>
</div>
<div class="my-2">
<span class="text-sm font-semibold">Status Muskuloskeletal - ROM</span>
</div>
<div class="my-2 rounded-md border border-slate-300 p-4">
<Block :colCount="2">
<Cell>
<Label dynamic>Leher</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>Batang Tubuh</Label>
<Field>
<Input />
</Field>
</Cell>
</Block>
<Block :colCount="2">
<Cell>
<Label dynamic>AGA</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>AGB</Label>
<Field>
<Input />
</Field>
</Cell>
</Block>
</div>
<div class="my-2">
<span class="text-sm font-semibold">Status Muskuloskeletal - MMT</span>
</div>
<div class="my-2 rounded-md border border-slate-300 p-4">
<Block :colCount="2">
<Cell>
<Label dynamic>Leher</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>Batang Tubuh</Label>
<Field>
<Input />
</Field>
</Cell>
</Block>
<Block :colCount="2">
<Cell>
<Label dynamic>AGA</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>AGB</Label>
<Field>
<Input />
</Field>
</Cell>
</Block>
</div>
<div class="my-2">
<span class="text-sm font-semibold">Statu Lokalis</span>
</div>
<Block>
<Cell>
<Label dynamic>Deskripsi Temuan Fisik</Label>
<Field>
<Textarea />
</Field>
</Cell>
</Block>
<Separator class="mt-8" />
<div class="my-2">
<h1 class="font-semibold">Pemeriksaan Penunjang</h1>
</div>
<Block>
<Cell>
<Label dynamic>Catatan Pemeriksaan Penunjang</Label>
<Field>
<Textarea />
</Field>
</Cell>
</Block>
<Separator class="mt-8" />
<div class="my-2">
<h1 class="font-semibold">Daftar Masalah</h1>
</div>
<Block :colCount="2">
<Cell>
<Label dynamic>Masalah Medik</Label>
<Field>
<Textarea />
</Field>
</Cell>
<Cell>
<Label dynamic>Masalah Rehabilitasi Medik</Label>
<Field>
<Textarea />
</Field>
</Cell>
</Block>
<Separator class="mt-8" />
<div class="my-2">
<h1 class="font-semibold">Diagnosa Fungsional (ICD-X)</h1>
</div>
<div class="mb-8 grid grid-cols-2 gap-4">
<AppIcdPreview />
</div>
<div class="my-2">
<h1 class="font-semibold">Program Rehabilitasi</h1>
</div>
<div class="my-2 rounded-md border border-slate-300 p-4">
<Block :colCount="3">
<Cell>
<Label dynamic>Modalitas Fisik</Label>
<Field>
<Textarea />
</Field>
</Cell>
<Cell>
<Label dynamic>Latihan</Label>
<Field>
<Textarea />
</Field>
</Cell>
<Cell>
<Label dynamic>Ortesa Protesa</Label>
<Field>
<Textarea />
</Field>
</Cell>
</Block>
<Block :colCount="2">
<Cell>
<Label dynamic>Edukasi</Label>
<Field>
<Textarea />
</Field>
</Cell>
<Cell>
<Label dynamic>Lain-Lain</Label>
<Field>
<Textarea />
</Field>
</Cell>
</Block>
</div>
</div>
</form>
</template> </template>
+454 -140
View File
@@ -1,172 +1,486 @@
<script setup lang="ts"> <script setup lang="ts">
import Block from '~/components/pub/my-ui/form/block.vue' import Block from '~/components/pub/my-ui/doc-entry/block.vue'
import FieldGroup from '~/components/pub/my-ui/form/field-group.vue' import Cell from '~/components/pub/my-ui/doc-entry/cell.vue'
import Field from '~/components/pub/my-ui/form/field.vue' import Field from '~/components/pub/my-ui/doc-entry/field.vue'
import Label from '~/components/pub/my-ui/form/label.vue' import Label from '~/components/pub/my-ui/doc-entry/label.vue'
const props = defineProps<{
excludeFields?: string[]
}>()
const emits = defineEmits(['click'])
const subject = ref({
'prim-compl': '',
'sec-compl': '',
'cur-disea-hist': '',
'pas-disea-hist': '',
'fam-disea-hist': '',
'alg-hist': '',
'alg-react': '',
'med-hist': '',
'blood-type': '',
})
const isExcluded = (key: string) => props.excludeFields?.includes(key)
const disorders = ref<string[]>([])
const therapies = ref<string[]>([])
const summary = ref('')
const disorderOptions = [
'Fungsi Otot',
'Fungsi Sendi',
'Fungsi Jalan',
'Fungsi Syaraf',
'Fungsi Koordinasi',
'Jantung',
'Fungsi Respirasi',
'Fungsi Menelan',
'Fungsi Bladder',
'Fungsi Bowel',
'Fungsi Luhur',
'Fungsi Kontrol Postur',
'Fungsi Eksekusi',
'Fungsi Ortosa/Protesa',
'Gangguan Aktivitas Sehari-hari',
'Lainnya',
]
const therapyOptions = ['Terapi Latihan', 'Modalitas Fisik', 'Protesa/Ortosa', 'Medikamentosa', 'Lain-lain: Konsultasi']
</script> </script>
<template> <template>
<form id="entry-form"> <form id="entry-form">
<div class="mb-5 border-b border-b-slate-300 pb-3 text-lg xl:text-xl"> <div class="mb-5 border-b border-b-slate-300 pb-3 text-lg xl:text-xl">
<Block> <Block>
<FieldGroup> <Cell>
<Label dynamic>Sudah Vaksin</Label>
<Field>
<Select
:options="[
{ label: 'Sudah', value: 'yes' },
{ label: 'Belum', value: 'no' },
]"
/>
</Field>
</FieldGroup>
<FieldGroup>
<Label dynamic>Kasus</Label>
<Field>
<Select
:options="[
{ label: 'Baru', value: 'baru' },
{ label: 'Lama', value: 'lama' },
]"
/>
</Field>
</FieldGroup>
<FieldGroup>
<Label dynamic>Kunjungan</Label>
<Field>
<Select
:options="[
{ label: 'Baru', value: 'baru' },
{ label: 'Lama', value: 'lama' },
]"
/>
</Field>
</FieldGroup>
<!-- Riwayat Penyakit -->
<FieldGroup :column="2">
<Label dynamic>Keluhan Utama</Label> <Label dynamic>Keluhan Utama</Label>
<Field> <Field>
<Textarea placeholder="Masukkan anamnesa pasien" /> <Textarea />
</Field> </Field>
</FieldGroup> </Cell>
<FieldGroup :column="2"> </Block>
<Label dynamic>Riwayat Penyakit</Label>
<Field>
<Textarea
placeholder="Masukkan anamnesa pasien (Riwayat Penyakit Sekarang, Dahulu, Pengobatan, Keluarga, dll)"
/>
</Field>
</FieldGroup>
<FieldGroup :column="2"> <Block :colCount="2">
<Label dynamic>SpO₂</Label> <Cell>
<Label dynamic>Riwayat Penyakit Dahulu</Label>
<Field> <Field>
<Input type="number" placeholder="%" /> <Textarea />
</Field> </Field>
</FieldGroup> </Cell>
<FieldGroup :column="2"> <Cell>
<Label dynamic>Tekanan Darah Sistol</Label> <Label dynamic>Riwayat Penyakit Sekarang</Label>
<Field> <Field>
<Input type="number" placeholder="mmHg" /> <Textarea />
</Field> </Field>
</FieldGroup> </Cell>
</Block>
<Separator class="mt-8" />
<FieldGroup :column="2"> <div class="my-2">
<Label dynamic>Tekanan Darah Diastol</Label> <h1 class="font-semibold">Pemeriksaan Fisik</h1>
</div>
<Block>
<Cell>
<Label dynamic>Umum</Label>
<Field> <Field>
<Input type="number" placeholder="mmHg" /> <Input placeholder="Sistolik" />
</Field> </Field>
</FieldGroup> </Cell>
</Block>
<FieldGroup :column="2"> <div class="my-2">
<Label dynamic>Respirasi</Label> <h1 class="font-semibold">Tanda Vital</h1>
</div>
<div class="my-2 rounded-md border border-slate-300 p-4">
<Block>
<Cell>
<Label dynamic>Kesadaran (GCS)</Label>
<Field> <Field>
<Input type="number" placeholder="kali/menit" /> <Input />
</Field> </Field>
</FieldGroup> </Cell>
</Block>
<Block :colCount="2">
<Cell>
<Label dynamic>Pernapasan</Label>
<Field>
<Input />
</Field>
</Cell>
<FieldGroup :column="2"> <Cell>
<Label dynamic>Jenis</Label>
<Field>
<Input />
</Field>
</Cell>
</Block>
<Block :colCount="2">
<Cell>
<Label dynamic>Nadi</Label> <Label dynamic>Nadi</Label>
<Field> <Field>
<Input type="number" placeholder="kali/menit" /> <Input />
</Field> </Field>
</FieldGroup> </Cell>
<Cell>
<FieldGroup :column="2"> <Label dynamic>Jenis</Label>
<Label dynamic>Temperatur</Label>
<Field> <Field>
<Input type="number" placeholder="℃" /> <Input />
</Field> </Field>
</FieldGroup> </Cell>
<FieldGroup :column="2">
<Label dynamic>Berat Badan</Label>
<Field>
<Input type="number" placeholder="Kg" />
</Field>
</FieldGroup>
<FieldGroup :column="2">
<Label dynamic>Tinggi Badan</Label>
<Field>
<Input type="number" placeholder="Cm" />
</Field>
</FieldGroup>
<FieldGroup :column="2">
<Label dynamic>Golongan Darah</Label>
<Field>
<Select :options="bloodGroups" />
</Field>
</FieldGroup>
<FieldGroup :column="2">
<Label dynamic>Pemeriksaan Fisik (Yang Mendukung)</Label>
<Field>
<Textarea placeholder="Masukkan pemeriksaan fisik" />
</Field>
</FieldGroup>
<!-- Prosedur -->
<FieldGroup :column="2">
<Label dynamic>Diagnosa (ICD-X)</Label>
<Field>
<button class="rounded bg-orange-100 px-3 py-1 text-orange-600">+ Pilih Diagnosa</button>
</Field>
</FieldGroup>
<!-- Diagnosa -->
<FieldGroup :column="2">
<Label dynamic>Diagnosa (ICD-X)</Label>
<Field>
<button class="rounded bg-orange-100 px-3 py-1 text-orange-600">+ Pilih Diagnosa</button>
</Field>
</FieldGroup>
<FieldGroup :column="3">
<Label dynamic>Diagnosa Medis</Label>
<Field>
<Textarea />
</Field>
</FieldGroup>
<FieldGroup :column="3">
<Label dynamic>Rencana Awal Medis</Label>
<Field>
<Textarea />
</Field>
</FieldGroup>
<FieldGroup :column="3">
<Label dynamic>Terapi</Label>
<Field>
<Textarea />
</Field>
</FieldGroup>
</Block> </Block>
<Block :colCount="2">
<Cell>
<Label dynamic>Tekanan Darah Lengan Kanan</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>Tekanan Darah Lengan Kiri</Label>
<Field>
<Input />
</Field>
</Cell>
</Block>
<Block :colCount="2">
<Cell>
<Label dynamic>Suhu Aksila</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>Suhu Rektal</Label>
<Field>
<Input />
</Field>
</Cell>
</Block>
</div>
<div class="my-2">
<h1 class="font-semibold">Pemeriksaan Badan</h1>
</div>
<div class="my-2 rounded-md border border-slate-300 p-4">
<Block>
<Cell>
<Label dynamic>Kulit</Label>
<Field>
<Input />
</Field>
</Cell>
</Block>
</div>
<div class="my-2 rounded-md border border-slate-300 p-4">
<Block :colCount="3">
<Cell>
<Label dynamic>Kepala</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>Telinga</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>Hidung</Label>
<Field>
<Input />
</Field>
</Cell>
</Block>
<Block :colCount="3">
<Cell>
<Label dynamic>Rongga Mulut/Tenggorokan</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>Mata</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>Lain-Lain</Label>
<Field>
<Input />
</Field>
</Cell>
</Block>
</div>
<div class="my-2 rounded-md border border-slate-300 p-4">
<Block :colCount="3">
<Cell>
<Label dynamic>Leher</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>Kelenjar Tiroid</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>Lain-Lain</Label>
<Field>
<Input />
</Field>
</Cell>
</Block>
</div>
<div class="my-2 rounded-md border border-slate-300 p-4">
<Block :colCount="3">
<Cell>
<Label dynamic>Thorax</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>Jantung</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>Paru-Paru</Label>
<Field>
<Input />
</Field>
</Cell>
</Block>
<Block>
<Cell>
<Label dynamic>Lain-Lain</Label>
<Field>
<Input />
</Field>
</Cell>
</Block>
</div>
<div class="my-2 rounded-md border border-slate-300 p-4">
<Block :colCount="3">
<Cell>
<Label dynamic>Abdomen</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>Hati</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>Lien</Label>
<Field>
<Input />
</Field>
</Cell>
</Block>
<Block>
<Cell>
<Label dynamic>Lain-Lain</Label>
<Field>
<Input />
</Field>
</Cell>
</Block>
</div>
<div class="my-2 rounded-md border border-slate-300 p-4">
<Block :colCount="3">
<Cell>
<Label dynamic>Punggung</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>Ekstremitas</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>Kelamin</Label>
<Field>
<Input />
</Field>
</Cell>
</Block>
<Block :colCount="2">
<Cell>
<Label dynamic>Rectum</Label>
<Field>
<Input />
</Field>
</Cell>
<Cell>
<Label dynamic>System Syaraf</Label>
<Field>
<Input />
</Field>
</Cell>
</Block>
</div>
<Block :colCount="2">
<Cell>
<Label dynamic>Neuromoskuloskeletal</Label>
<Field>
<Textarea />
</Field>
</Cell>
<Cell>
<Label dynamic>Kardiorespirasi</Label>
<Field>
<Textarea />
</Field>
</Cell>
</Block>
<Separator class="mt-8" />
<div class="my-2">
<h1 class="font-semibold">Pemeriksaan Penunjang</h1>
</div>
<Block :colCount="2">
<Cell>
<Label dynamic>Pencitraan</Label>
<Field>
<Textarea />
</Field>
</Cell>
<Cell>
<Label dynamic>Laboratorium</Label>
<Field>
<Textarea />
</Field>
</Cell>
</Block>
<div class="mb-8 grid grid-cols-2 gap-4">
<div>
<span class="text-md">Diagnosa Medis (ICD-X)</span>
<Button
class="my-2 rounded bg-orange-100 px-3 py-1 text-orange-600"
type="button"
@click="emits('click', 'prosedur')"
>
+ Pilih Prosedur
</Button>
<AppIcdPreview />
</div>
<div>
<span class="text-md">Diagnosa Medis (ICD-X)</span>
<Button
class="my-2 rounded bg-orange-100 px-3 py-1 text-orange-600"
type="button"
@click="emits('click', 'prosedur')"
>
+ Pilih Prosedur
</Button>
<AppIcdPreview />
</div>
<div>
<span class="text-md">Diagnosa Medis (ICD-X)</span>
<Button
class="my-2 rounded bg-orange-100 px-3 py-1 text-orange-600"
type="button"
@click="emits('click', 'prosedur')"
>
+ Pilih Prosedur
</Button>
<AppIcdPreview />
</div>
</div>
<div class="space-y-8">
<div>
<h3 class="mb-3 text-lg font-semibold">Gangguan Fungsi</h3>
<div class="grid grid-cols-3 gap-2">
<div
v-for="opt in disorderOptions"
:key="opt"
class="flex items-center space-x-2"
>
<Checkbox
:id="opt"
:value="opt"
v-model="disorders"
/>
<Label
:for="opt"
class="text-sm"
>
{{ opt }}
</Label>
</div>
</div>
<div class="mt-4 space-y-2">
<Label
for="summary"
class="font-medium"
>
Kesimpulan Didapatkan Gangguan Fungsi
<span class="text-red-500">*</span>
</Label>
<Textarea
id="summary"
v-model="summary"
placeholder="Masukkan kesimpulan gangguan fungsi"
/>
</div>
</div>
<Separator />
<!-- REKOMENDASI TERAPI -->
<div>
<h3 class="mb-3 text-lg font-semibold">Rekomendasi Terapi Tindakan Yang Diperlukan</h3>
<div class="grid grid-cols-3 gap-2">
<div
v-for="opt in therapyOptions"
:key="opt"
class="flex items-center space-x-2"
>
<Checkbox
:id="opt"
:value="opt"
v-model="therapies"
/>
<Label
:for="opt"
class="text-sm"
>
{{ opt }}
</Label>
</div>
</div>
</div>
</div>
</div> </div>
</form> </form>
</template> </template>
+13 -3
View File
@@ -8,8 +8,10 @@ import CompTab from '~/components/pub/my-ui/comp-tab/comp-tab.vue'
import type { TabItem } from '~/components/pub/my-ui/comp-tab/type' import type { TabItem } from '~/components/pub/my-ui/comp-tab/type'
import Status from '~/components/app/encounter/status.vue' import Status from '~/components/app/encounter/status.vue'
import AssesmentFunctionList from '~/components/content/assesment-function/list.vue' // import AssesmentFunctionList from '~/components/content/assesment-function/list.vue'
import EarlyMedicalAssesmentList from '~/components/content/soapi/entry.vue' import EarlyMedicalAssesmentList from '~/components/content/soapi/entry.vue'
import EarlyMedicalRehabList from '~/components/content/soapi/entry.vue'
import AssesmentFunctionList from '~/components/content/soapi/entry.vue'
const route = useRoute() const route = useRoute()
const router = useRouter() const router = useRouter()
@@ -38,7 +40,11 @@ const data = {
const tabs: TabItem[] = [ const tabs: TabItem[] = [
{ value: 'status', label: 'Status Masuk/Keluar', component: Status }, { value: 'status', label: 'Status Masuk/Keluar', component: Status },
{ value: 'early-medical-assessment', label: 'Pengkajian Awal Medis', component: EarlyMedicalAssesmentList }, { value: 'early-medical-assessment', label: 'Pengkajian Awal Medis', component: EarlyMedicalAssesmentList },
{ value: 'rehab-medical-assessment', label: 'Pengkajian Awal Medis Rehabilitasi Medis' }, {
value: 'rehab-medical-assessment',
label: 'Pengkajian Awal Medis Rehabilitasi Medis',
component: EarlyMedicalRehabList,
},
{ value: 'function-assessment', label: 'Asesmen Fungsi', component: AssesmentFunctionList }, { value: 'function-assessment', label: 'Asesmen Fungsi', component: AssesmentFunctionList },
{ value: 'therapy-protocol', label: 'Protokol Terapi' }, { value: 'therapy-protocol', label: 'Protokol Terapi' },
{ value: 'education-assessment', label: 'Asesmen Kebutuhan Edukasi' }, { value: 'education-assessment', label: 'Asesmen Kebutuhan Edukasi' },
@@ -66,6 +72,10 @@ const tabs: TabItem[] = [
<PubMyUiNavContentBa label="Kembali ke Daftar Kunjungan" /> <PubMyUiNavContentBa label="Kembali ke Daftar Kunjungan" />
</div> </div>
<AppEncounterQuickInfo :data="data" /> <AppEncounterQuickInfo :data="data" />
<CompTab :data="tabs" :initial-active-tab="activeTab" @change-tab="activeTab = $event" /> <CompTab
:data="tabs"
:initial-active-tab="activeTab"
@change-tab="activeTab = $event"
/>
</div> </div>
</template> </template>
+27 -5
View File
@@ -1,16 +1,38 @@
<script setup lang="ts"> <script setup lang="ts">
import { computed } from 'vue' import { computed } from 'vue'
import { useRoute, useRouter } from 'vue-router' import { useRoute } from 'vue-router'
import { useQueryMode } from '@/composables/useQueryMode' // asumsikan ini ada
import EarlyMedicalAssesmentList from './list.vue' import SoapiList from './list.vue'
import EarlyMedicalAssesmentForm from './form.vue' import EarlyForm from './form.vue'
import RehabForm from './form-rehab.vue'
import FunctionForm from './form-function.vue'
const route = useRoute()
const type = computed(() => (route.query.tab as string) || 'early-medical-assessment')
const { mode, openForm, backToList } = useQueryMode('mode') const { mode, openForm, backToList } = useQueryMode('mode')
const formMap = {
'early-medical-assessment': EarlyForm,
'rehab-medical-assessment': RehabForm,
'function-assessment': FunctionForm,
}
const ActiveForm = computed(() => formMap[type.value] || EarlyForm)
</script> </script>
<template> <template>
<div> <div>
<EarlyMedicalAssesmentList v-if="mode === 'list'" @add="openForm" /> <SoapiList
<EarlyMedicalAssesmentForm v-else @back="backToList" /> v-if="mode === 'list'"
@add="openForm"
/>
<component
v-else
:is="ActiveForm"
@back="backToList"
/>
</div> </div>
</template> </template>
@@ -0,0 +1,45 @@
<script setup lang="ts">
import Entry from '~/components/app/soapi/entry.vue'
import Dialog from '~/components/pub/my-ui/modal/dialog.vue'
const isOpen = ref(false)
const data = ref([])
const isLoading = reactive<DataTableLoader>({
isTableLoading: false,
})
async function getPatientList() {
isLoading.isTableLoading = true
const resp = await xfetch('/api/v1/patient')
if (resp.success) {
data.value = (resp.body as Record<string, any>).data
}
isLoading.isTableLoading = false
}
onMounted(() => {
getPatientList()
})
function handleClick(type: string) {
console.log(type)
isOpen.value = true
}
provide('table_data_loader', isLoading)
</script>
<template>
<Entry
type="function"
:exclude-fields="['prim-compl', 'sec-compl']"
@click="handleClick"
/>
<Dialog
v-model:open="isOpen"
title="Pilih Prosedur"
size="xl"
prevent-outside
>
<AppIcdMultiselectPicker :data="data" />
</Dialog>
</template>
@@ -0,0 +1,45 @@
<script setup lang="ts">
import Entry from '~/components/app/soapi/entry.vue'
import Dialog from '~/components/pub/my-ui/modal/dialog.vue'
const isOpen = ref(false)
const data = ref([])
const isLoading = reactive<DataTableLoader>({
isTableLoading: false,
})
async function getPatientList() {
isLoading.isTableLoading = true
const resp = await xfetch('/api/v1/patient')
if (resp.success) {
data.value = (resp.body as Record<string, any>).data
}
isLoading.isTableLoading = false
}
onMounted(() => {
getPatientList()
})
function handleClick(type: string) {
console.log(type)
isOpen.value = true
}
provide('table_data_loader', isLoading)
</script>
<template>
<Entry
type="early-rehab"
:exclude-fields="['prim-compl', 'sec-compl']"
@click="handleClick"
/>
<Dialog
v-model:open="isOpen"
title="Pilih Prosedur"
size="xl"
prevent-outside
>
<AppIcdMultiselectPicker :data="data" />
</Dialog>
</template>