<template>
	<view style="display: flex; align-items: center;">
		<uni-rate :disabled="readonly" :max="props.formProps.max || 5" :allow-half="props.formProps.enableHalf"
			:activeColor="props.formProps.color" :readonly="props.readonly" v-model="_value" />
		<text style="margin-left: 5px;" v-if="props.formProps.showScore">{{_value}}</text>
	</view>

</template>

<script setup>
	import { computed } from 'vue'

	const props = defineProps({
		formProps: {
			type: Object,
			default: () => {
				return {}
			}
		},
		modelValue: {
			type: Number,
			default: 0
		},
		readonly: Boolean
	})

	const _value = computed({
		get() {
			return props.modelValue
		},
		set(val) {
			emits('update:modelValue', val)
		}
	})

	const emits = defineEmits(['update:modelValue'])
</script>

<style>
</style>