simrsx-fe/app/components/app/encounter/check-out-view.vue

<script lang="ts" setup>
//
import { LucidePen, LucideCheck } from 'lucide-vue-next';

//
import * as CB from '~/components/pub/my-ui/combobox'
import { dischargeMethodCodes } from '~/lib/constants';

import * as Table from '~/components/pub/ui/table'
import * as DE from '~/components/pub/my-ui/doc-entry'
import type { Encounter } from '~/models/encounter';

interface Props {
  encounter: Encounter
  canUpdate?: boolean
}
const props = defineProps<Props>()

const dischargeMethodItems = CB.recStrToItem(dischargeMethodCodes)

const emit = defineEmits<{
  edit: [],
  finish: []
}>()
</script>

<template>
  <DE.Block :cellFlex="false">
    <DE.Cell>
      <DE.Label class="font-semibold">Alasan Keluar</DE.Label>
      <DE.Field>
        <div class="py-2 border-b border-b-slate-300">{{ encounter.discharge_method_code || '-belum ditentukan-' }}</div>
      </DE.Field>
    </DE.Cell>

    <DE.Cell>
      <DE.Label class="font-semibold">Waktu Keluar</DE.Label>
      <DE.Cell>
        <div class="py-2 border-b border-b-slate-300">{{ encounter.discharge_date || '-belum ditentukan-' }}</div>
      </DE.Cell>
    </DE.Cell>

    <DE.Cell v-if="'death' == encounter.discharge_method_code">
      <DE.Label class="font-semibold">Sebab Meninggal</DE.Label>
      <DE.Cell>
        <div class="mb-3">
          <div class="py-2 border-b border-b-slate-300">{{ encounter.discharge_date }}</div>
        </div>
      </DE.Cell>
    </DE.Cell>

    <DE.Cell v-if="['consul-poly', 'consul-executive'].includes(encounter.discharge_method_code || '')">
      <DE.Label class="font-semibold">Tujuan</DE.Label>
      <DE.Field>
        <Table.Table class="border mb-3">
          <Table.TableHeader class="bg-neutral-100 dark:bg-slate-800">
            <Table.TableCell class="text-center">Poly</Table.TableCell>
            <Table.TableCell class="text-center">DPJP</Table.TableCell>
            <Table.TableCell class="text-center !w-10"></Table.TableCell>
          </Table.TableHeader>
          <Table.TableBody>
            <Table.TableRow v-for="(item, index) in encounter.internalReferences" :key="index">
              <Table.TableCell class="!p-0.5">
              </Table.TableCell>
              <Table.TableCell class="!p-0.5">
              </Table.TableCell>
              <Table.TableCell>
              </Table.TableCell>
            </Table.TableRow>
          </Table.TableBody>
        </Table.Table>
      </DE.Field>
    </DE.Cell>
  </DE.Block>
  <div v-if="canUpdate" class="text-center [&>*]:mx-1">
    <Button @click="() => emit('edit')">
      <LucidePen />
      Edit
    </Button>
    <Button @click="() => emit('finish')">
      <LucideCheck />
      Selesai
    </Button>
  </div>
</template>

<style>

</style>