<template>
    <div>
        <a-range-picker
                format="YYYY-MM-DD"
                value-format="YYYY-MM-DD"
                v-model="dateInner"
                :ranges="ranges"
        />
    </div>
</template>

<script>
    import moment from 'moment';

    export default {
        name: "dateRangePicker",
        props: {
            date: {
                type: Array,
            }
        },
        created() {
            let ranges = {
                '今天': [moment(), moment()],
                '本周':  [moment().add(-7, 'days'), moment()],
                '本月': [moment().startOf('month'), moment().endOf('month')],
                '近三个月': [moment().add(-90, 'days'), moment()],
                '近半年': [moment().add(-180, 'days'), moment()],
                '近一年': [moment().add(-365, 'days'), moment()],
            }
            this.ranges=ranges;
        },
        data() {
            return {
                dateInner: this.date,
                ranges: {}
            };
        },
        watch: {
            dateInner(val) {
                this.$emit('update:date', val)
            },
            date(val) {
                this.dateInner = val
            }
        },
        methods: {
            moment,
        }
    }
</script>

<style scoped>

</style>