<template>
    <div class="row  go-form-row flex-div">
        <go-label :item="inputItem"
        ></go-label>
        <div class="go-content pull-left" style="position: relative;width:50%">
            <iSwitch size="large" v-model="switchValue" @on-change="changeSwitch">
                <span slot="open">启用</span>
                <span slot="close">停用</span>
            </iSwitch>
        </div>
    </div>
</template>

<script>
    import GoLabel from "./commponents/go-label";
    import formMixin from "../../mixins/formMixins";
    import {AssertUtils} from "goingutils";

    export default {
        name: "go-switch",
        mixins: [formMixin],
        data: function () {
            return {
                switchValue: false,
                changeView: true
            };
        },
        props: {
            value: {
                type: [Boolean, String,Number],
                default: false
            },
            item: {
                type: Object,
                default: () => {
                    return {};
                }
            }
        },
        computed: {},
        mounted() {
            this.switchValue = AssertUtils.parseBoolean(this.value);
            let vueObj = this;
            if (AssertUtils.isNotEmpty(this.value)) {
                setTimeout(function () {
                    vueObj.changeSwitch(AssertUtils.parseBoolean(vueObj.value));
                }, 100);
            }
        },
        watch: {
            value(newVal) {
                if (this.changeView) {
                    this.switchValue = AssertUtils.parseBoolean(newVal);
                }
                if (newVal != null) {
                    let vueObj = this;
                    setTimeout(function () {
                        vueObj._changeEvent(vueObj.switchValue);
                    });
                }
                //变更组件视图为true
                this.changeView = true;
            }
        },
        methods: {
            _changeEvent(status) {
                if (AssertUtils.isFunction(this.item["change"])) {
                    this.item["change"](this, {vueObj:this, elVal: status});
                }
                this.$emit("change", {elVal: status});
            },
            changeSwitch(status) {
                this.changeView = false;
                if (status) {
                    this.$emit("input", true);
                } else {
                    this.$emit("input", "false");
                }
                this._changeEvent(status);
            }
        },
        components: {
            GoLabel
        }
    };
</script>
