<template>
    <Radio-group :value="handleValue" @on-change="updateValue" style="width: 350px;">
        <Radio :label="season.id" v-for="season in seasonList" :key="season.id" :disabled="disable">
            <span>{{season.label}}</span>
        </Radio>
    </Radio-group>
</template>

<script>
export default {
    name: 'radio-season',
    props: {
        value: {
            type: String
        },
        disable: {
            type: Boolean
        }
    },
    data() {
        return {
            handleValue: this.value,
            seasonList: [{
                id: 'spring',
                label: '春秋'
            }, {
                id: 'summer',
                label: '夏'
            }, {
                id: 'winter',
                label: '冬'
            }, {
                id: 'seasons',
                label: '四季'
            }]
        };
    },
    methods: {
        updateValue(newValue) {
            this.$emit('input', newValue);
        }
    },
    watch: {
        value(newValue) {
            this.handleValue = newValue;
        }
    }

};
</script>

<style>

</style>