'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var vue = require('vue');
var svg = require('@element-plus/icons-vue');
require('../../stores/index.js');
var ainputdropdow = require('../../stores/ainputdropdow.js');

var _sfc_main = /* @__PURE__ */ vue.defineComponent({
  ...{
    name: "Fminputdropdown"
  },
  __name: "index",
  props: /* @__PURE__ */ vue.mergeModels({
    //数据
    optionData: {
      type: Array,
      default: []
    },
    /**
     * 值的属性值
     */
    bvalue: {
      type: String,
      default: "id"
    },
    /**
     * 值的属性标签
     */
    blabel: {
      type: String,
      default: "name"
    },
    placeholder: {
      type: String,
      default: "\u8BF7\u9009\u62E9"
    },
    inputWidth: {
      type: String,
      default: "40%"
    },
    dropWidth: {
      type: String,
      default: "90px"
    },
    dropHeight: {
      type: String,
      default: "180px"
    },
    /**
    * api service name
    */
    apiService: {
      type: String,
      default: "baseData"
    },
    /**
    * api service 下的方法
    */
    apiAction: {
      type: String,
      default: "baseDataList"
    },
    /**
     * 基础编码 自动获取数据
     */
    basecode: {
      type: String,
      default: ""
    },
    /**
    * 基础编码  多个编码合在一起调用
    */
    multibasecode: {
      type: Array,
      default: []
    },
    freshSize: {
      type: [Number, String],
      default: 20
    },
    /**
    * 是否默认加载数据
    */
    autoLoadData: {
      type: Boolean,
      default: true
    }
  }, {
    "id": { default: 0, required: false },
    "idModifiers": {},
    "name": { default: "", required: false },
    "nameModifiers": {}
  }),
  emits: /* @__PURE__ */ vue.mergeModels(["change"], ["update:id", "update:name"]),
  setup(__props, { emit: __emit }) {
    const modeValueId = vue.useModel(__props, "id");
    const modeValueName = vue.useModel(__props, "name");
    const props = __props;
    const state = vue.reactive({
      optionData: props.optionData
    });
    const emit = __emit;
    const handCommand = (command) => {
      const fitem = state.optionData.find((item) => item[props.bvalue] === command);
      modeValueId.value = fitem != null ? fitem[props.bvalue] : 0;
      modeValueName.value = fitem != null ? fitem[props.blabel] : "";
      emit("change", fitem);
    };
    const handelChange = (val) => {
      emit("change", val);
    };
    vue.onMounted(async () => {
      if (props.optionData.length > 0) {
        state.optionData = props.optionData;
      }
      if (props.autoLoadData && props.basecode && props.basecode != "") {
        const useBaseApi = ainputdropdow.usefminputdropdownstore();
        state.optionData = await useBaseApi.getOptionsData(props.apiService, props.apiAction, props.basecode, false, props.multibasecode);
      }
    });
    const handRestdata = async () => {
      if (props.basecode && props.basecode != "") {
        const useBaseApi = ainputdropdow.usefminputdropdownstore();
        state.optionData = await useBaseApi.getOptionsData(props.apiService, props.apiAction, props.basecode, true, []);
      }
    };
    return (_ctx, _cache) => {
      const _component_el_icon = vue.resolveComponent("el-icon");
      const _component_el_input = vue.resolveComponent("el-input");
      const _component_el_dropdown_item = vue.resolveComponent("el-dropdown-item");
      const _component_el_dropdown_menu = vue.resolveComponent("el-dropdown-menu");
      const _component_el_dropdown = vue.resolveComponent("el-dropdown");
      return vue.openBlock(), vue.createBlock(_component_el_dropdown, {
        class: "fminputdropdown",
        placement: "bottom-start",
        trigger: "click",
        style: { "width": "100%" },
        onCommand: handCommand
      }, {
        dropdown: vue.withCtx(() => [
          vue.createVNode(_component_el_dropdown_menu, {
            style: vue.normalizeStyle({ width: __props.dropWidth, height: __props.dropHeight })
          }, {
            default: vue.withCtx(() => [
              (vue.openBlock(true), vue.createElementBlock(
                vue.Fragment,
                null,
                vue.renderList(state.optionData, (item, index) => {
                  return vue.openBlock(), vue.createBlock(_component_el_dropdown_item, {
                    key: index,
                    command: item[__props.bvalue],
                    divided: ""
                  }, {
                    default: vue.withCtx(() => [
                      vue.createTextVNode(
                        vue.toDisplayString(item[__props.blabel]),
                        1
                        /* TEXT */
                      )
                    ]),
                    _: 2
                    /* DYNAMIC */
                  }, 1032, ["command"]);
                }),
                128
                /* KEYED_FRAGMENT */
              ))
            ]),
            _: 1
            /* STABLE */
          }, 8, ["style"])
        ]),
        default: vue.withCtx(() => [
          vue.createVNode(_component_el_input, {
            modelValue: modeValueName.value,
            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modeValueName.value = $event),
            placeholder: props.placeholder,
            style: vue.normalizeStyle({ width: __props.inputWidth }),
            onChange: handelChange
          }, {
            suffix: vue.withCtx(() => [
              vue.createVNode(_component_el_icon, {
                color: "#13c2c2",
                size: __props.freshSize,
                onClick: handRestdata
              }, {
                default: vue.withCtx(() => [
                  vue.createVNode(vue.unref(svg.RefreshLeft))
                ]),
                _: 1
                /* STABLE */
              }, 8, ["size"])
            ]),
            _: 1
            /* STABLE */
          }, 8, ["modelValue", "placeholder", "style"])
        ]),
        _: 1
        /* STABLE */
      });
    };
  }
});

exports.default = _sfc_main;
