import type { Col, KeyLabel, RecComponent, RecStrFuncComponent, RecStrFuncUnknown, Th } from '../../pub/nav/types'
import { defineAsyncComponent } from 'vue'

type SmallDetailDto = any

export const rowType = {
  1: 'Patient',
  2: 'Encounter',
  3: 'Observation',
}

export const rowStatus = {
  0: 'Gagal',
  1: 'Pending',
  2: 'Terkirim',
}

const patientBadge = defineAsyncComponent(() => import('./badge-patient.vue'))
const statusBadge = defineAsyncComponent(() => import('./badge-status.vue'))

export const cols: Col[] = [
  { width: 100 },
  { width: 100 },
  { width: 100 },
  { width: 100 },
  { width: 100 },
  { width: 100 },
]

export const header: Th[][] = [
  [
    { label: 'ID' },
    { label: 'Jenis' },
    { label: 'Pasien' },
    { label: 'Status' },
    { label: 'Terakhir Update' },
    { label: 'FHIR ID' },
  ],
]

export const keys = ['id', 'resource_type', 'patient', 'status', 'updated_at', 'fhir_id']

export const delKeyNames: KeyLabel[] = [
  { key: 'code', label: 'Kode' },
  { key: 'name', label: 'Nama' },
]

export const funcParsed: RecStrFuncUnknown = {
  name: (rec: unknown): unknown => {
    const recX = rec as SmallDetailDto
    return `${recX.firstName} ${recX.middleName || ''} ${recX.lastName || ''}`
  },
}

export const funcComponent: RecStrFuncComponent = {
  patient(rec, idx) {
    const res: RecComponent = {
      idx,
      rec: rec as object,
      component: patientBadge,
    }
    return res
  },
  status(rec, idx) {
    const res: RecComponent = {
      idx,
      rec: rec as object,
      component: statusBadge,
    }
    return res
  },
}

export const funcHtml: RecStrFuncUnknown = {
  patient_address(_rec) {
    return '-'
  },
}
