<script setup lang="ts">
import dayjs from 'dayjs'

withDefaults(
  defineProps<{
    type: 'Original' | 'Date' | 'Avatar' | 'Select'
    value: number | string | Date
    customClass?: string
    options?: { label: string; value: string | number }[]
  }>(),
  { type: 'Original', value: '' },
)
</script>
<template>
  <div>
    <span v-if="type === 'Original'">{{ value }}</span>
    <span v-if="type === 'Date'">{{ dayjs(value).format('YYYY-MM-DD') }}</span>
    <img v-if="type === 'Avatar'" :src="value" class="w-10 h-10 rounded-full" />
    <span v-if="type === 'Select'">{{ options?.find((it) => it.value === value)?.label }}</span>
  </div>
</template>
