<script setup lang="ts">
import { z } from 'zod'
import Entry from '~/components/app/cprj/entry.vue'
import Action from '~/components/pub/my-ui/nav-footer/ba-dr-su.vue'
import ActionDialog from '~/components/pub/my-ui/nav-footer/ba-su.vue'
import Dialog from '~/components/pub/my-ui/modal/dialog.vue'
import { CprjSoapiSchema } from '~/schemas/soapi.schema'
import { toast } from '~/components/pub/ui/toast'
import { handleActionSave, handleActionEdit } from '~/handlers/soapi-early.handler'
const { backToList } = useQueryMode('mode')

const route = useRoute()
const fungsional = ref([])
const schema = CprjSoapiSchema
const payload = ref({
  encounter_id: 0,
  time: '',
  typeCode: 'dev-record',
  value: '',
})
const model = ref({
  ppa: '',
  ppa_name: '',
  subjective: '',
  objective: '',
  assesment: '',
  plan: '',
  review: '',
})

const isLoading = reactive<DataTableLoader>({
  isTableLoading: false,
})

onMounted(() => {})

const cprjRef = ref()
async function actionHandler(type: string) {
  if (type === 'back') {
    backToList()
    return
  }
  const result = await cprjRef.value?.validate()
  console.log('result', result)
  if (result?.valid) {
    console.log('data', result.data)
    handleActionSave(
      {
        ...payload.value,
        value: JSON.stringify(result.data),
        encounter_id: +route.params.id,
        time: new Date().toISOString(),
      },
      {},
      toast,
    )
  } else {
    console.log('Ada error di form', result)
  }
}

provide('table_data_loader', isLoading)
</script>
<template>
  <Entry
    ref="cprjRef"
    v-model="model"
    :schema="schema"
    type="function"
  />
  <div class="my-2 flex justify-end py-2">
    <Action @click="actionHandler" />
  </div>
</template>
