<script setup lang="ts">
//
import { getValueLabelList as getDoctorValueLabelList } from '~/services/doctor.service'
import { getValueLabelList as getUnitValueLabelList } from '~/services/unit.service'
import type { CheckInFormData, CheckOutFormData } from '~/schemas/encounter.schema'
import { CheckInSchema, CheckOutSchema } from '~/schemas/encounter.schema'

//
import Checkin from '~/components/app/encounter/checkin-entry.vue'
import Checkout from '~/components/app/encounter/checkout-entry.vue'
import type { Encounter } from '~/models/encounter'

//
const props = defineProps<{
  encounter: Encounter
}>()

// doctors
const doctors = await getDoctorValueLabelList()

// units
const units = await getUnitValueLabelList()

// check in
const checkInValues = ref<any>({
  dischargeMethod_code: '',
  unit_id: 0,
  responsibleDoctor_id: 0,
})
const checkInIsLoading = ref(false)
const checkInIsReadonly = ref(false)

// check out
const checkOutValues = ref<any>({
  dischargeMethod_code: '',
  unit_id: 0,
  responsibleDoctor_id: 0,
})
const checkOutIsLoading = ref(false)
const checkOutIsReadonly = ref(false)

function checkInSubmit(values: CheckInFormData) {
  console.log(values)
}

function checkOutSubmit(values: CheckOutFormData) {
  console.log(values)
}
</script>

<template>
  <div class="lg:grid grid-cols-2">
    <div class="border-r lg:pe-4 xl:pe-5">
      <div class="mb-4 xl:mb-5 text-base text-center font-semibold">Informasi Masuk</div>
      <Checkin
        :schema="CheckInSchema"
        :doctors="doctors"
        :encounter="encounter"
        :values="checkInValues"
        :is-loading="checkOutIsLoading"
        :is-readonly="checkOutIsReadonly"
        @submit="checkInSubmit"
      />
    </div>
    <div class="lg:ps-4 xl:ps-5">
      <div class="mb-4 xl:mb-5 text-base text-center font-semibold">Informasi Keluar</div>
      <Checkout
        :schema="CheckOutSchema"
        :doctors="doctors"
        :units="units"
        :values="checkOutValues"
        :is-loading="checkOutIsLoading"
        :is-readonly="checkOutIsReadonly"
        @submit="checkOutSubmit"
      />
    </div>
  </div>
</template>