<template>
    <go-input AUTOCOMPLETE="off"  v-model="curDate" :readOnly="true"
              :suffix="suffixIcon" @suffixClick="suffixClick"  :width="this.width" :item="this.inputItem" @initElObj="initElObj"></go-input>
</template>

<script>
    import {GoingUtils,DateFun} from "goingutils";
    import GoCommonInput from "./go-input";
    import formMixin from "../../mixins/formMixins";
    import {dhtmlXCalendarObject} from '../../dx/dxSource/components/dhtmlXCalendar';

    export default {
        name: "go-calendar",
        mixins: [formMixin],
        data(){
            return {
                suffixIcon: "ivu-icon ivu-icon-ios-calendar-outline",
                curDate:this.value,
                myCalendar:null,
                inputEl:null,
            };
        },
        props: {
            search: {
                type: Boolean,
                default: true
            },
            value: {},
            dateFormat:{
                type:String,
                default:'yyyy-MM-dd'
            },
            config: {
                type: Object,
                default: () => {
                    return {};
                }
            }
        },
        computed: {

        },
        mounted() {

        },
        methods: {
            //点击图标
            suffixClick(){
                if(this.myCalendar!=null){
                    let a=this.inputEl;let h=this.myCalendar;
                    if (!a._dhtmlxcalendar_uid) {
                        return;
                    }
                    if (h.i[a._dhtmlxcalendar_uid].input != null) {
                        h._updateFromInput(h.i[a._dhtmlxcalendar_uid].input);
                    }
                    h._show(a._dhtmlxcalendar_uid, true);
                }
            },
            initElObj(inputEl) {
                this.inputEl=inputEl;
                this.initDateCtl(inputEl);
            },
            initDateCtl(inputEl) {
                let myCalendar = new dhtmlXCalendarObject(inputEl);
                myCalendar.loadUserLanguage("ch");
                myCalendar.attachEvent("onShow", function () {
                    $(".dhtmlxcalendar_material").css(
                        "zIndex",
                        GoingUtils.getCurMaxZIndex()
                    );
                });
                //点击设置值
                myCalendar.attachEvent("onClick", (date)=>{
                    this.curDate=DateFun.formatDate(date, this.dateFormat);
                    this.$emit("input", DateFun.formatDate(date, this.dateFormat));
                });
                this.myCalendar=myCalendar;
            },
        },
        watch: {},
        beforeDestroy(){

        },
        components: {
            GoCommonInput
        }
    };
</script>
