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

withDefaults(
  defineProps<{
    type: 'Original' | 'Date' | 'Avatar' | 'Select' | 'img'
    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'">{{ value && dayjs(value).format('YYYY-MM-DD') }}</span>
    <wd-img v-if="type === 'Avatar'" width="40" height="40" round :src="String(value)" class="" />
    <div v-if="type === 'img'" v-for="(src, index) in value.split(',')" :key="index">
      <wd-img width="60" height="50" :src="src" :enable-preview="true" class="" />
    </div>

    <span v-if="type === 'Select'">{{ options?.find((it) => it.value === value)?.label }}</span>
  </div>
</template>
