<template>
    <label @click="changeCheckState" :class="wrapClasses">
        <span :class="checkboxClasses">
             <span v-show="checkValue===false" :class="unCheckClasses"></span>
             <span v-show="checkValue===true" :class="checkClasses"></span>
        </span>
        <slot><span v-if="showSlot">{{ btnItem.text }}</span></slot>
    </label>
</template>
<script>
    import {AssertUtils} from 'goingutils';
    import btnMixin from './mixins/btnMixin';

    const prefixCls = 'go-btn-checkbox';


    export default {
        name: 'goBtnCheck',
        mixins: [btnMixin],
        props: {
            btnItem:{},
        },
        data () {
            return {
                checkClasses:`goingicon go-checkboxoutlineblank`,
                unCheckClasses:`goingicon go-icon-checkboxmarked`,
                showSlot:true,
                checkValue:this.btnItem.defVal||false,
            };
        },
        computed: {
            wrapClasses () {
                return [
                    this.disabled?`${prefixCls}-wrapper disabled`:`${prefixCls}-wrapper`
                ];
            },
            checkboxClasses(){
                return [
                    `${prefixCls}-span`
                ];
            }
        },
        mounted () {

        },
        methods: {
            //获取按钮的id
            getBtnId(){
                if(this.btnItem&&AssertUtils.isNotEmpty(this.btnItem.id)){
                    return this.btnItem.id;
                }
            },
            //获取checkbox的值
            getCheckValue(){
                return this.checkValue;
            },
            getIsDisabled(){
                //判断是否为不可以编辑
                if(this.btnItem&&AssertUtils.isNotNull(this.btnItem.disabled)&&this.btnItem.disabled===true){
                    return this.btnItem.disabled;
                }
                return false;
            },
            //点击checkbox对象 切换选中未选中的状态
            changeCheckState(){
                let disabled=this.getIsDisabled();
                //如果是disabled则不
                if (!disabled) {
                    this.checkValue=!this.checkValue;
                    this.$emit("checkClick", {btnId:this.getBtnId(),value:this.getCheckValue()});
                }
            }
        },
        watch: {

        }
    };
</script>
