<template>
    <div
        :btnId="item.id"
        class="btn-select-item" :class="extClass"
        style="position: relative;max-width: 200px"
    >
        <div @mouseleave="hideSonBtns(item, $event)"  @mouseover="showSonBtns(item, $event)" class="go-btn-select" :class="getItemClass(item)">
            <div style="margin-right: 3px;">
                <i :class="item.img" aria-hidden="true"></i>
            </div>
            <div class="btnLabel margin-left-5">
                {{ item.text }}
            </div>
            <div class="btnImg btnSelect" style="position: relative;top:-1px;">
                <i class="ivu-icon ivu-icon-md-arrow-dropdown"></i>
            </div>
        </div>

        <goSonBtns
            @btnClick="btnClick"
            :sonBtns="item.btns"
            :btnId="item.id"
        ></goSonBtns>
    </div>
</template>

<script>
    import goSonBtns from "./go-son-btns";
    import {AssertUtils,GoingUtils,Dataset,QueryCommand} from "goingutils";
    import btnMixin from './mixins/btnMixin';


    export default {
        name: "go-btn-select",
        mixins: [btnMixin],
        props: ["item"],
        methods: {
            getDisabledClass(disabled) {
                if (disabled) {
                    return " disabled";
                } else {
                    return "";
                }
            },
            btnClick(btnId) {
                this.$emit("btnClick", btnId);
            },
            showSonBtns: function ({ id, disabled}) {
                if (this.disabled||disabled) {
                    return void(0);
                }else{
                    $(".go_son_btns[btnId='" + id + "']")
                        .show()
                        .css("top", 25)
                        .attr("showFlag", "true");
                }
            },
            getItemClass(item) {
                let {disabled} = item;
                if (AssertUtils.isNotEmpty(item.class)) {
                    return item.class + " " + this.getDisabledClass(disabled);
                } else {
                    return "btn-circle" + " " + this.getDisabledClass(disabled);
                }
            },
            hideSonBtns: function ({type, id, img}) {
                $(".go_son_btns[btnId='" + id + "']")
                    .hide()
                    .attr("showFlag", "false");
            }
        },
        mounted() {
            let vueBtnItem = this.item;
            let toolBarId = this.$parent.id;
            //      如果扫描状态为true 而且不是本界面 而且父toolBarId必须设置了相应的id 才进行扫描
            if (
                GoingUtils.getTotalParams("ctlScan") &&
                !toolBarId.startsWith("uuid-")
            ) {
                let queryCommand = new QueryCommand(
                    "/go-framework/controlResource/addControlResource"
                );
                queryCommand.showTip = false;
                let submitJson = {
                    dataset: new Dataset({
                        pageResourceId: GoingUtils.getTotalParams("pageResourceId"),
                        pageResourceName: GoingUtils.getTotalParams("pageResourceName"),
                        barMenuId: toolBarId,
                        controlIds: vueBtnItem.id,
                        controlNames: vueBtnItem.text
                    })
                };
                if (
                    GoingUtils.getTotalParams("pageResourceId") != null &&
                    vueBtnItem.id != null
                ) {
                    queryCommand.executeQuery(submitJson, () => {
                    }, () => {
                    }, "json");
                }
            }
        },
        computed: {
            extClass(){
                return this.disabled?'disabled':'';
            },
        },
        components: {
            goSonBtns
        }
    };
</script>
