<template>
  <span v-if="_readonly" v-text="readonlyText"></span>
  <Datepicker v-else v-bind="_fieldProps" v-model="value" :disabled="disabled" :placeholder="_placeholder" />
</template>
<script setup>
import { inject, useAttrs, computed,onMounted } from 'vue';
import { useFieldBasics } from '../usefieldBasics';
import { Datepicker } from '@king-design/vue';
import { useRoute } from 'vue-router';
import { isArray} from 'lodash-es';

const route = useRoute();
const $Attrs = useAttrs();
const formInfo = inject('formInfo');
const emit = defineEmits(['change']);
const readonlyText = computed(() => {
	if (isArray(value.value)) {
		return value.value.join(' ~ ');
	}
	return value.value;
});
const { value, _readonly, disabled, _placeholder,_fieldProps,onLinkage } = useFieldBasics($Attrs, formInfo, route, emit);
onMounted(async () => {
	onLinkage();
});
</script>

<style lang="less">
</style>
