<script setup>
	/**
	 * name：
	 * user：sa0ChunLuyu
	 * date：2024年9月11日 19:24:50
	 */
	import {
		ref,
		onMounted
	} from 'vue'
	import {
		$api,
		$response
	} from '@/api'
	import {
		useStore
	} from '@/store'
	const $emit = defineEmits(['setValue'])
	const $store = useStore()
	const $props = defineProps({
		info: {
			type: Object,
			default: () => {
				return {
					id: 0
				}
			}
		},
		index: {
			type: String,
			default: ''
		}
	});

	const mountedAction = () => {

	}

	const onKeyInput = (e) => {
		$emit('setValue', $props.index, e.detail.value)
	}

	const getEndDate = () => {
		const date = new Date();
		let year = date.getFullYear();
		let month = date.getMonth() + 1;
		let day = date.getDate();
		month = month > 9 ? month : '0' + month;
		day = day > 9 ? day : '0' + day;
		return `${year}-${month}-${day}`;
	}

	onMounted(() => {
		mountedAction()
	})
</script>
<template>
	<view>
		<view class="input_wrapper">
			<picker mode="date" :value="$props.info['value']" :end="getEndDate" @change="onKeyInput">
				<view class="date_show_wrapper">{{ $props.info['value'] }}</view>
			</picker>
		</view>
	</view>
</template>
<style scoped>
	.date_show_wrapper {
		margin-left: 10px;
	}

	.input_wrapper {
		width: 100%;
		height: 60rpx;
		border-radius: 6rpx;
		line-height: 60rpx;
		border: 1rpx #cccccc solid;
		margin-top: 20rpx;
	}

	.input_wrapper input {
		height: 60rpx;
		line-height: 60rpx;
		padding-left: 20rpx;
	}
</style>