import type { Config, RecComponent, RecStrFuncComponent, RecStrFuncUnknown } from '~/components/pub/my-ui/data-table'
import { defineAsyncComponent } from 'vue'
import type { Consultation } from '~/models/consultation'

type SmallDetailDto = any

const action = defineAsyncComponent(() => import('~/components/pub/my-ui/data/dropdown-action-ud.vue'))
export const config: Config = {
  cols: [{ width: 100 }, {}, {}, {}, { width: 50 }],
  headers: [[
    { label: 'Tanggal' },
    { label: 'Tujuan' },
    { label: 'Dokter' },
    { label: 'Pertanyaan' },
    { label: 'Jawaban' },
    { label: '' },
  ]],
  keys: ['date', 'dstUnit.name', 'dstDoctor.name', 'problem', 'solution', 'action'],
  delKeyNames: [
    { key: 'data', label: 'Tanggal' },
    { key: 'dstDoctor.name', label: 'Dokter' },
  ],
  parses: {
    action(rec, idx) {
      const res: RecComponent = {
        idx,
        rec: rec as object,
        component: action,
        props: {
          size: 'sm',
        },
      }
      return res
    },
    date(rec) {
      const recX = rec as Consultation
      return recX.date?.substring(0, 10) || '-'
    }
  },
  components: {
    action(rec, idx) {
      const res: RecComponent = {
        idx,
        rec: rec as object,
        component: action,
        props: {
          size: 'sm',
        },
      }
      return res
    },
  } as RecStrFuncComponent,
  htmls: {} as RecStrFuncUnknown,
}
