<template>
    <div class="row go-form-row flex-div go-common-drop-ctl" :id="dropCtlId">
        <go-label
            :labelWidth="labelWidth"
            :labelAlign="labelAlign"
            :item="item"
        ></go-label>
        <div :class="'go-content ' + getInputWid()" :style="getInputWidStyle()">
            <div
                :class="'input-group ' + getInputWid()"
                style="cursor:pointer"
                @click="showWin(inputId, $event, item)"
            >
                <input AUTOCOMPLETE="off"
                    :itemId="item.id"
                    :id="inputId"
                    readonly
                    :value="value"
                    ref="inputObj"
                    :class="[
            item.validation ? 'error-input' : '',
            item.disabled ? 'input-disabled' : ''
          ]"
                    type="text"
                    class="form-control"
                    :placeholder="'请' + item.label"
                />
                <go-clear-input-icon
                    @clickClearIcon="clickClearIcon"
                    v-model="value"
                    :right="30"
                ></go-clear-input-icon>
                <go-drop-icon></go-drop-icon>
            </div>
            <i
                v-if="item.validation"
                @mouseover="showToolTip(item, $event)"
                @mouseleave="hideToolTip(item, $event)"
                class="fas fa-exclamation-triangle error-drop-info"
            ></i>
        </div>
    </div>
</template>

<script>
    import GoClearInputIcon from "./commponents/go-clear-input-icon";
    import GoDropIcon from "./commponents/go-drop-icon";
    import GoLabel from "./commponents/go-label";
    import formMixin from "../../mixins/formMixins";
    import {GoingUtils,WinUtils} from "goingutils";

    export default {
        name: "go-win-drop",
        mixins: [formMixin],
        data: function () {
            return {
                clearFlag: false,
                dropCtlId: GoingUtils.getUUid(12),
                inputId: GoingUtils.getUUid(12)
            };
        },
        props: {
            label: {
                type: Boolean,
                default: true
            },
            icon: {
                type: Boolean,
                default: true
            },
            value: {}
        },
        computed: {},
        mounted() {
        },
        methods: {
            clickClearIcon(event) {
                this.$emit("input", "");
                event.preventDefault();
                return false;
            },
            //弹出窗口
            showWin(inputId, event, item) {
                if (item.disabled) {
                    return void 0;
                }
                let vueObj = this;
                let {
                    winWidth,
                    winHeight,
                    winTitle,
                    pageUrl,
                    backFun,
                    param = {},
                    showBottomBar = false
                } = this.item;
                WinUtils.showInfoOnWin(
                    {
                        width: winWidth,
                        height: winHeight,
                        url: pageUrl,
                        showBottomBar: showBottomBar,
                        params: GoingUtils.mergeJson({}, param),
                        title: winTitle,
                        anim: null,
                        confirmBtn: (winId, closeWinFun) => {
                            this.$emit("confirm", closeWinFun);
                        }
                    },
                    function (params) {
                        vueObj.$emit("change", {value: params, id: inputId});
                        backFun(params, vueObj);
                    }
                );
            },
            updateVal({value = "", label = ""}) {
                let _inputId = this.inputId;
                this.$emit("input", label);
                $(`#${_inputId}`).val(label);
                this.$emit("seleFun", {value, label});
            },
            clearInputValue() {
                let _inputId = this.inputId;
                $(`#${_inputId}`).val("");
                this.$emit("input", "");
                this.clearFlag = false;
            }
        },
        components: {
            GoDropIcon: GoDropIcon,
            GoLabel,
            GoClearInputIcon: GoClearInputIcon
        }
    };
</script>
