import { ref, toRaw } from 'vue'

export type selectedValueType = string | number
export type selectedLabelType = string | number
export interface selectedValueItem {
	value: selectedValueType
	label: selectedLabelType
}
export type modelValueSelected = number | string

export default (emit = null) => {
	const selectedValue = ref<selectedValueItem>(null)

	const addSelectedValue = (item: selectedValueItem) => {
		emit &&
			emit('select', {
				data: item.value,
				item: toRaw(item),
			})
		if (selectedValue.value.value === item.value) {
			return
		}
		selectedValue.value = item
		emit && emit('change', selectedValue.value.value)
		emit && emit('update:modelValue', selectedValue.value.value)
	}

	const clearSelectedValue = () => {
		selectedValue.value = null
		emit && emit('clear')
		emit && emit('change', null)
		emit && emit('update:modelValue', null)
	}

	const addSelectedValueByModelValue = (
		modelValue: string | number,
		{ sourceListMap },
	) => {
		selectedValue.value = sourceListMap.value[modelValue] || {}
	}

	const getSelectedValueList = (list: selectedValueItem[]) => {
		return list.map(item => item.value)
	}

	return {
		selectedValue,
		clearSelectedValue,
		addSelectedValue,
		getSelectedValueList,
		addSelectedValueByModelValue,
	}
}