'use strict';

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

var vue = require('vue');
var iconsVue = require('@element-plus/icons-vue');
var index$1 = require('../../message/index.js');
var index$2 = require('../../input/index.js');
var index$8 = require('../../scrollbar/index.js');
var index$3 = require('../../select/index.js');
var index$4 = require('../../icon/index.js');
var index$5 = require('../../popover/index.js');
var index$6 = require('../../button/index.js');
var index$7 = require('../../tag/index.js');
require('../../../hooks/index.js');
var batch = require('./batch.js');
var useBatch = require('./use-batch.js');
var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
var index = require('../../../hooks/use-namespace/index.js');

const _hoisted_1 = /* @__PURE__ */ vue.createTextVNode("\u6E05\u7A7A");
const _hoisted_2 = /* @__PURE__ */ vue.createTextVNode("\u5173\u95ED");
const _hoisted_3 = /* @__PURE__ */ vue.createTextVNode("\u641C\u7D22");
const __default__ = vue.defineComponent({
  name: "ElBatch"
});
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  ...__default__,
  props: batch.batchProps,
  emits: batch.batchEmits,
  setup(__props, { expose, emit }) {
    var _a;
    const props = __props;
    const useSize = vue.reactive({
      size: vue.toRef(props, "size")
    });
    const ns = index.useNamespace("batch");
    const { disabled, _size } = useBatch.useBatch(props, useSize.size);
    const userAttrs = vue.useAttrs();
    const textareaRef = vue.ref();
    const userAttrsCopy = vue.reactive({ ...userAttrs });
    delete userAttrsCopy.size;
    delete userAttrsCopy.prefixIcon;
    delete userAttrsCopy.suffixIcon;
    delete userAttrsCopy.rows;
    delete userAttrsCopy.readonly;
    delete userAttrsCopy.tabindex;
    delete userAttrsCopy.modelValue;
    delete userAttrsCopy.resize;
    delete userAttrsCopy.autosize;
    delete userAttrsCopy.type;
    const inputRef = vue.ref(null);
    const selectRef = vue.ref(null);
    const tooltipVisible = vue.ref(false);
    const optionValue = vue.ref((_a = props.options[0]) == null ? void 0 : _a.value);
    const selectWidth = vue.ref(0);
    const searchValue = vue.ref("");
    const inputValue = vue.ref("");
    const selectedLabel = vue.ref("");
    const multipleSearchValue = vue.ref([]);
    const tagShow = vue.ref(false);
    vue.onMounted(() => {
      var _a2;
      changeOption(optionValue.value);
      if (disabled.value)
        return;
      selectWidth.value = (_a2 = selectRef.value) == null ? void 0 : _a2.$el.offsetWidth;
    });
    const handleEnterKey = (event) => {
      const inputElement = textareaRef.value.$el.querySelector("textarea");
      inputElement.addEventListener("paste", preventPaste);
      const lines = inputValue.value.split("\n");
      const lastLine = lines[lines.length - 1];
      vue.nextTick(() => {
        var _a2;
        const textarea = (_a2 = textareaRef.value) == null ? void 0 : _a2.textarea;
        textarea.selectionStart = textarea.selectionEnd = textarea.value.length;
      });
      if (!lastLine.trim() || lines.length >= props.rows) {
        event.preventDefault();
      }
    };
    const handleTextareaInput = (value) => {
      const inputElement = textareaRef.value.$el.querySelector("textarea");
      inputElement.addEventListener("paste", preventPaste);
      const lines = value.split("\n");
      const nonEmptyLines = lines.filter((line) => line.trim() !== "");
      if (nonEmptyLines.length >= props.rows) {
        inputValue.value = lines.slice(0, props.rows).join("\n");
      } else {
        inputElement.removeEventListener("paste", preventPaste);
      }
    };
    const preventPaste = (event) => {
      event.preventDefault();
    };
    const handleFocus = () => {
      handleClose();
      vue.nextTick(() => {
        inputRef.value.blur();
        inputRef.value.focus();
      });
    };
    const changeOption = (value) => {
      handleClose();
      emit("optionsChange", value);
    };
    const handleSearch = () => {
      if (disabled.value)
        return;
      emit("search", {
        searchValue: searchValue.value,
        optionValue: optionValue.value
      });
    };
    const handleClear = () => {
      handleBlur();
      inputValue.value = "";
      emit("clearMultipleValue");
    };
    const handleClose = () => {
      tooltipVisible.value = false;
    };
    const handleBlur = () => {
      const focusElement = inputRef.value.$el.querySelector(".is-focus");
      const activeElement = document.activeElement;
      activeElement == null ? void 0 : activeElement.blur();
      if (focusElement) {
        focusElement.classList.remove("is-focus");
      }
    };
    const handleMultipleSearch = () => {
      handleBlur();
      handleClose();
      const data = inputValue.value.split("\n").map((item) => item.trim()).filter(Boolean);
      multipleSearchValue.value = [...new Set(data)];
      if (data.length > multipleSearchValue.value.length) {
        index$1.ElMessage.warning("\u6709\u91CD\u590D\u6570\u636E,\u5DF2\u81EA\u52A8\u53BB\u91CD");
      }
      inputValue.value = multipleSearchValue.value.join("\n");
      if (props.needTag) {
        tagShow.value = true;
      }
      vue.nextTick(() => {
        selectedLabel.value = selectRef.value.selectedLabel;
      });
      emit("multipleSearch", {
        multipleSearchValue: multipleSearchValue.value,
        optionsValue: optionValue.value
      });
    };
    const showTooltip = () => {
      var _a2;
      if (disabled.value)
        return;
      handleBlur();
      selectWidth.value = (_a2 = selectRef.value) == null ? void 0 : _a2.$el.offsetWidth;
      tooltipVisible.value = !tooltipVisible.value;
    };
    const handleCloseTag = () => {
      tagShow.value = false;
    };
    const clear = () => {
      var _a2;
      multipleSearchValue.value = [];
      optionValue.value = (_a2 = props.options[0]) == null ? void 0 : _a2.value;
      searchValue.value = "";
    };
    expose({
      size: props.size,
      fullData: {
        multipleSearchValue: multipleSearchValue.value,
        optionsValue: optionValue.value,
        searchValue: searchValue.value
      },
      clear
    });
    return (_ctx, _cache) => {
      return vue.openBlock(), vue.createElementBlock("div", {
        class: vue.normalizeClass([vue.unref(ns).b(), vue.unref(ns).is("disabled", vue.unref(disabled)), vue.unref(ns).m(vue.unref(_size))]),
        style: vue.normalizeStyle({ "max-width": _ctx.width + "px" })
      }, [
        vue.createVNode(vue.unref(index$2.ElInput), vue.mergeProps({
          ref_key: "inputRef",
          ref: inputRef,
          modelValue: searchValue.value,
          "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => searchValue.value = $event),
          clearable: ""
        }, userAttrsCopy, {
          disabled: vue.unref(disabled),
          class: vue.unref(ns).e("input"),
          style: { width: _ctx.width + "px" },
          onClick: handleFocus
        }), {
          prepend: vue.withCtx(() => [
            _ctx.$slots.prepend ? (vue.openBlock(), vue.createElementBlock("div", {
              key: 0,
              class: vue.normalizeClass(vue.unref(ns).e("prepend"))
            }, [
              vue.renderSlot(_ctx.$slots, "prepend")
            ], 2)) : vue.createCommentVNode("v-if", true),
            vue.createVNode(vue.unref(index$3.ElSelect), {
              ref_key: "selectRef",
              ref: selectRef,
              modelValue: optionValue.value,
              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => optionValue.value = $event),
              style: { "height": "100%" },
              class: vue.normalizeClass([vue.unref(ns).e("select"), vue.unref(ns).is("disabled", vue.unref(disabled))]),
              disabled: vue.unref(disabled),
              onChange: changeOption
            }, {
              prefix: vue.withCtx(() => {
                var _a2, _b;
                return [
                  vue.createElementVNode("span", {
                    class: vue.normalizeClass(vue.unref(ns).is("empty", _ctx.options.length <= 0))
                  }, vue.toDisplayString((_b = (_a2 = _ctx.options.find((s) => s.value === optionValue.value)) == null ? void 0 : _a2.label) != null ? _b : _ctx.emptyText), 3)
                ];
              }),
              default: vue.withCtx(() => [
                (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.options, (item) => {
                  return vue.openBlock(), vue.createBlock(vue.unref(index$3.ElOption), {
                    key: item.value,
                    label: item[_ctx.labelValue.label],
                    value: item[_ctx.labelValue.value]
                  }, null, 8, ["label", "value"]);
                }), 128))
              ]),
              _: 1
            }, 8, ["modelValue", "class", "disabled"])
          ]),
          suffix: vue.withCtx(() => [
            vue.createVNode(vue.unref(index$4.ElIcon), {
              class: vue.normalizeClass(vue.unref(ns).e("batch-icon")),
              onClick: vue.withModifiers(handleSearch, ["stop"])
            }, {
              default: vue.withCtx(() => [
                vue.createVNode(vue.unref(iconsVue.Search))
              ]),
              _: 1
            }, 8, ["class", "onClick"]),
            vue.createVNode(vue.unref(index$5.ElPopover), {
              effect: "light",
              placement: "bottom-end",
              "popper-class": vue.unref(ns).e("batch-popper"),
              class: vue.normalizeClass(vue.unref(ns).e("batch-tooltip")),
              visible: tooltipVisible.value,
              offset: 20,
              width: Number(_ctx.width) - selectWidth.value
            }, {
              reference: vue.withCtx(() => [
                vue.createVNode(vue.unref(index$4.ElIcon), {
                  class: vue.normalizeClass(vue.unref(ns).e("tooltip-icon")),
                  onClick: vue.withModifiers(showTooltip, ["stop"])
                }, {
                  default: vue.withCtx(() => [
                    vue.createVNode(vue.unref(iconsVue.Operation))
                  ]),
                  _: 1
                }, 8, ["class", "onClick"])
              ]),
              default: vue.withCtx(() => [
                vue.createVNode(vue.unref(index$2.ElInput), {
                  ref_key: "textareaRef",
                  ref: textareaRef,
                  modelValue: inputValue.value,
                  "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => inputValue.value = $event),
                  resize: "none",
                  autosize: { minRows: _ctx.minRows, maxRows: 12 },
                  class: vue.normalizeClass(vue.unref(ns).e("textarea")),
                  placeholder: "\u7CBE\u786E\u641C\u7D22\uFF0C\u4E00\u884C\u4E00\u9879\uFF0C\u6700\u591A\u652F\u6301" + _ctx.rows + "\u884C",
                  type: "textarea",
                  onKeydown: vue.withKeys(handleEnterKey, ["enter"]),
                  onInput: handleTextareaInput
                }, null, 8, ["modelValue", "autosize", "class", "placeholder", "onKeydown"]),
                vue.createElementVNode("div", {
                  class: vue.normalizeClass(vue.unref(ns).e("controls"))
                }, [
                  vue.createVNode(vue.unref(index$6.ElButton), {
                    size: "small",
                    plain: "",
                    onClick: vue.withModifiers(handleClear, ["stop"])
                  }, {
                    default: vue.withCtx(() => [
                      _hoisted_1
                    ]),
                    _: 1
                  }, 8, ["onClick"]),
                  vue.createElementVNode("div", null, [
                    vue.createVNode(vue.unref(index$6.ElButton), {
                      size: "small",
                      plain: "",
                      onClick: vue.withModifiers(handleClose, ["stop"])
                    }, {
                      default: vue.withCtx(() => [
                        _hoisted_2
                      ]),
                      _: 1
                    }, 8, ["onClick"]),
                    vue.createVNode(vue.unref(index$6.ElButton), {
                      size: "small",
                      class: vue.normalizeClass(vue.unref(ns).e("search-button")),
                      plain: "",
                      onClick: vue.withModifiers(handleMultipleSearch, ["stop"])
                    }, {
                      default: vue.withCtx(() => [
                        _hoisted_3
                      ]),
                      _: 1
                    }, 8, ["class", "onClick"])
                  ])
                ], 2)
              ]),
              _: 1
            }, 8, ["popper-class", "class", "visible", "width"])
          ]),
          _: 3
        }, 16, ["modelValue", "disabled", "class", "style"]),
        vue.withDirectives(vue.createElementVNode("div", {
          class: vue.normalizeClass(vue.unref(ns).e("tag"))
        }, [
          vue.createVNode(vue.unref(index$5.ElPopover), {
            width: Number(_ctx.width) - selectWidth.value,
            "popper-class": vue.unref(ns).e("batch-popper"),
            effect: "light",
            placement: "bottom-start"
          }, {
            reference: vue.withCtx(() => [
              vue.createVNode(vue.unref(index$7.ElTag), {
                closable: "",
                onClose: handleCloseTag
              }, {
                default: vue.withCtx(() => [
                  vue.createTextVNode(vue.toDisplayString(selectedLabel.value) + "\uFF1A" + vue.toDisplayString(multipleSearchValue.value.slice(0, 3).join(", ")) + " \u7B49" + vue.toDisplayString(multipleSearchValue.value.length) + "\u9879 ", 1)
                ]),
                _: 1
              })
            ]),
            default: vue.withCtx(() => [
              vue.createElementVNode("div", {
                class: vue.normalizeClass(vue.unref(ns).e("tag-content")),
                style: vue.normalizeStyle({ "min-width": Number(_ctx.width) - selectWidth.value + "px" })
              }, [
                vue.createVNode(vue.unref(index$8.ElScrollbar), null, {
                  default: vue.withCtx(() => [
                    (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(multipleSearchValue.value, (item) => {
                      return vue.openBlock(), vue.createElementBlock("p", { key: item }, vue.toDisplayString(item), 1);
                    }), 128))
                  ]),
                  _: 1
                })
              ], 6)
            ]),
            _: 1
          }, 8, ["width", "popper-class"])
        ], 2), [
          [vue.vShow, tagShow.value]
        ])
      ], 6);
    };
  }
});
var Batch = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "D:\\project\\work\\code-monkey-ui\\packages\\components\\batch\\src\\batch.vue"]]);

exports["default"] = Batch;
//# sourceMappingURL=batch2.js.map
