<style>
    
</style>
<template>
    <Select
    :value="currentValue" 
    @on-change="updateValue">
        <Option value="" key="k1">无</Option>
        <Option value="0" key="k2">整数</Option>
        <Option value="0.0" key="k3">1位小数</Option>
        <Option value="0.00" key="k4">2位小数</Option>
        <Option value="0.000" key="k5">3位小数</Option>
        <Option value="0.0000" key="k6">4位小数</Option>
        <Option value="0.0%" key="k7">百分比1位小数</Option>
        <Option value="0.00%" key="k8">百分比2位小数</Option>
        <Option value="#,###" key="k9">整数(,分隔)</Option>
        <Option value="#,###.0" key="k10">1位小数(,分隔)</Option>
        <Option value="#,###.00" key="k11">2位小数(,分隔)</Option>
        <Option value="#,###.000" key="k12">3位小数(,分隔)</Option>
        <Option value="#,###.0000" key="k13">4位小数(,分隔)</Option>
        <Option value="yyyy-MM-dd" key="k14">年-月-日</Option>
        <Option value="yyyy-MM-dd HH:mm:ss" key="k15">年-月-日 时:分:秒</Option>
        <Option value="HH:mm:ss" key="16">时:分:秒</Option>
    </Select>
</template>
<script>
    export default {
        name: 'FormatSelector',
        props: {
            value: {
                type: String,
                default: ''
            }
        },
        data() {
            return {
                currentValue: ''
            }
        },

        watch: {
            value(newVal){
                this.currentValue = newVal;
            }
        },

        methods: {
            updateValue(value) {
                this.currentValue = value;
                this.$emit('input', value);
                this.$emit('on-change', value);
            }
        }
    };
</script>