<template>
  <view>
    <uni-easyinput :value="value" type="text" placeholder="请输入" @input="$emit('on-change', $event)" v-if="config.type === 'input'" />

    <uni-datetime-picker type="datetime" :value="value" :modelValue="value" @change="$emit('on-change', $event)"
                         v-else-if="config.type === 'datetime'" />

    <uni-data-checkbox :value="value" :localdata="config.range" @change="$emit('on-change', $event.detail.value)"
                       v-else-if="config.type === 'radio'" />

    <uni-data-select :value="value" :modelValue="value" :localdata="config.range" @change="$emit('on-change', $event)"
                     v-else-if="config.type === 'select'"></uni-data-select>

    <view v-else-if="config.type === 'text'" class="flex-1 flex justify-end uni-secondary-color u-font-sm" style="height: 35px;"
          @click="$emit('on-click', config.text)">
      {{ value }}
      <uni-icons type="forward" v-if="config.rightArrow" size="16" />
    </view>
  </view>
</template>

<script lang="ts" setup>
import { CODE_DICT } from '@/config/code'
import type { IConfig } from '@/config/code'
import { computed } from 'vue'

interface IProps {
  code: string
  value: string
}

const props = defineProps<IProps>()
defineEmits(['on-change'])

const config = computed<IConfig>(() => CODE_DICT[props.code])
</script>

<style lang="scss" scoped>
</style>
