<script setup lang="ts">
import type { Prescription } from '~/models/prescription';

defineProps<{
  data: Prescription
}>()
</script>

<template>
  <div class="md:grid md:grid-cols-2">
    <div class="md:pe-10">
      <PubMyUiDocEntryBlock>
        <PubMyUiDocEntryCell>
          <PubMyUiDocEntryLabel>Tgl Order</PubMyUiDocEntryLabel>
          <PubMyUiDocEntryField>
              <Input :value="data.issuedAt || data.createdAt?.substring(0, 10)" readonly />
          </PubMyUiDocEntryField>
        </PubMyUiDocEntryCell>
        <PubMyUiDocEntryCell>
          <PubMyUiDocEntryLabel>Status</PubMyUiDocEntryLabel>
          <PubMyUiDocEntryField>
              <Input v-model="data.status_code" readonly />
          </PubMyUiDocEntryField>
        </PubMyUiDocEntryCell>
      </PubMyUiDocEntryBlock>
    </div>
    <div class="md:ps-10">
      <PubMyUiDocEntryBlock>
        <PubMyUiDocEntryCell>
          <PubMyUiDocEntryLabel position="dynamic">DPJP</PubMyUiDocEntryLabel>
          <PubMyUiDocEntryField>
              <Input v-model="data.doctor.employee.person.name" readonly />
          </PubMyUiDocEntryField>
        </PubMyUiDocEntryCell>
        <PubMyUiDocEntryCell>
          <PubMyUiDocEntryLabel position="dynamic">PPDS</PubMyUiDocEntryLabel>
          <PubMyUiDocEntryField>
              <Input value="......" readonly />
          </PubMyUiDocEntryField>
        </PubMyUiDocEntryCell>
      </PubMyUiDocEntryBlock>
    </div>
  </div>
  <!-- <div class="">
    <Button>
      <Icon name="i-lucide-check" />
      Simpan
    </Button>
  </div> -->
</template>
