@fmdeui/fmui 1.0.1

package/es/packages/components/select-table/src/index.vue2.mjs

@@ -0,0 +1,835 @@
+import { defineComponent, useSlots, ref, computed, reactive, watch, nextTick, onMounted, onBeforeUnmount, onUpdated, useAttrs, resolveComponent, resolveDirective, openBlock, createBlock, mergeProps, isRef, unref, createSlots, renderList, withCtx, renderSlot, normalizeProps, guardReactiveProps, withDirectives, createElementVNode, normalizeStyle, createElementBlock, createVNode, createTextVNode, toDisplayString, createCommentVNode, withModifiers, Fragment } from 'vue';
+import '../../query-condition/src/index.vue.mjs';
+import './renderCol.vue.mjs';
+import { ElMessage } from 'element-plus';
+import ClickOutside from './ClickOutside.mjs';
+import { useVirtualized } from './useVirtualized.mjs';
+import '../../../hooks/index.mjs';
+import { useLocale } from '../../../hooks/useLocale.mjs';
+import _sfc_main$1 from '../../query-condition/src/index.vue2.mjs';
+import _sfc_main$2 from './renderCol.vue2.mjs';
+
+const _hoisted_1 = {
+  key: 0,
+  class: "table_query_condition"
+};
+const _hoisted_2 = ["element-loading-text"];
+const _hoisted_3 = { key: 2 };
+const _hoisted_4 = {
+  key: 0,
+  class: "f-table-select__page"
+};
+var _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "FSelectTable"
+  },
+  __name: "index",
+  props: {
+    modelValue: { default: void 0 },
+    inputValue: { default: void 0 },
+    defaultSelectVal: { default: () => [] },
+    radioSelectValLabel: { default: "" },
+    table: { default: () => ({
+      data: [],
+      currentPage: 1,
+      pageSize: 10,
+      total: 0
+    }) },
+    keywords: { default: () => ({
+      value: "value",
+      label: "label"
+    }) },
+    value: {},
+    columns: { default: () => [] },
+    multiple: { type: Boolean, default: false },
+    filterable: { type: Boolean, default: true },
+    remote: { type: Boolean, default: false },
+    remoteMethod: { type: Function, default: void 0 },
+    filterMethod: { type: Function, default: void 0 },
+    isShowInput: { type: Boolean, default: false },
+    inputAttr: { default: () => ({}) },
+    inputWidth: { default: 550 },
+    selectWidth: { default: 550 },
+    tableWidth: { default: 550 },
+    isShowQuery: { type: Boolean, default: false },
+    isShowBlurBtn: { type: Boolean, default: false },
+    btnBind: { default: () => ({ btnTxt: "" }) },
+    align: { default: "center" },
+    reserveSelection: { type: Boolean, default: true },
+    selectable: { type: Function, default: void 0 },
+    multipleFixed: { type: [String, Boolean], default: true },
+    radioTxt: { default: "" },
+    radioFixed: { type: [String, Boolean], default: true },
+    tableSize: { default: "default" },
+    border: { type: Boolean, default: true },
+    isShowFirstColumn: { type: Boolean, default: true },
+    useVirtual: { type: Boolean, default: false },
+    virtualShowSize: { default: 30 },
+    isShowPagination: { type: Boolean, default: false },
+    paginationSize: { default: "small" },
+    selfExpanded: { type: Boolean, default: false },
+    isClearQuery: { type: Boolean, default: false },
+    isRadioEchoLabel: { type: Boolean, default: true },
+    defaultValIsOpenRadioChange: { type: Boolean, default: false },
+    radioSameIsCancel: { type: Boolean, default: true },
+    rowClickRadio: { type: Boolean, default: true },
+    isKeyup: { type: Boolean, default: false },
+    isExpanded: { type: Boolean, default: false },
+    multipleDisableDelete: { type: Boolean, default: true },
+    tableLoading: { type: Boolean, default: false },
+    loadingTxt: { default: "" }
+  },
+  emits: ["page-change", "selectionChange", "radioChange", "update:inputValue", "input-focus", "input-blur", "input-clear", "input-click"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const { t } = useLocale();
+    const {
+      scrollContainerEl,
+      updateRenderedItemCache,
+      updateOffset,
+      getDom,
+      saveDATA,
+      getItemHeightFromCache
+    } = useVirtualized();
+    const props = __props;
+    const vClickOutside = ClickOutside;
+    const emits = __emit;
+    const slots = useSlots();
+    const isDefaultSelectVal = ref(true);
+    const forbidden = ref(true);
+    const isRadio = ref(false);
+    const isQueryVisible = ref(false);
+    const isVisible = ref(false);
+    const radioVal = ref("");
+    const isShowFirstRadio = ref(props.isShowFirstColumn);
+    const selectDefaultLabel = ref(props.modelValue);
+    const scrollTopNum = ref(0);
+    let selectInputVal = computed({
+      get() {
+        return props.inputValue;
+      },
+      set(val) {
+        emits("update:inputValue", val);
+      }
+    });
+    const state = reactive({
+      defaultSelectValue: props.defaultSelectVal,
+      // 默认选中
+      tableData: props.table.data,
+      // table数据
+      defaultValue: props.value,
+      ids: [],
+      // 多选id集合
+      tabularMap: {}
+      // 存储下拉tale的所有name
+    });
+    const computedBtnBind = computed(() => {
+      return props.btnBind.btnTxt ? props.btnBind : { btnTxt: t("plus.selectTable.searchBtnTxt") };
+    });
+    const computedRadioTxt = computed(() => {
+      return props.radioTxt || t("plus.selectTable.radioTxt");
+    });
+    const computedLoadingTxt = computed(() => {
+      return props.loadingTxt || t("plus.selectTable.loadingTxt");
+    });
+    const selectRef = ref(null);
+    const selectTable = ref(null);
+    const fQueryConditionRef = ref(null);
+    const nowIndex = ref(-1);
+    const tableDataLabelList = computed(() => {
+      return state.tableData.map((item) => item[props.keywords.label]);
+    });
+    watch(
+      () => props.table.data,
+      (val) => {
+        var _a, _b;
+        if (props.useVirtual) {
+          saveDATA.value = val;
+          updateRenderData(scrollTopNum.value);
+        } else {
+          state.tableData = val;
+          if (props.multiple && props.multipleDisableDelete) {
+            (_b = (_a = selectRef.value) == null ? void 0 : _a.$el) == null ? void 0 : _b.querySelectorAll(".el-tag").forEach((item) => {
+              var _a2, _b2;
+              if ((_b2 = tableDataLabelList.value) == null ? void 0 : _b2.includes(
+                (_a2 = item.querySelector(".el-select__tags-text")) == null ? void 0 : _a2.innerText
+              )) {
+                item.querySelector(".el-tag__close").style = "display: block";
+              } else {
+                item.querySelector(".el-tag__close").style = "display: none";
+              }
+            });
+          }
+        }
+        nextTick(() => {
+          state.tableData && state.tableData.length > 0 && state.tableData.forEach((item) => {
+            state.tabularMap[item[props.keywords.value]] = item[props.keywords.label];
+          });
+        });
+      },
+      { deep: true }
+    );
+    watch(
+      () => props.defaultSelectVal,
+      (val) => {
+        state.defaultSelectValue = val;
+        if (val.length > 0) {
+          if (props.multiple) {
+            if (isDefaultSelectVal.value) {
+              defaultSelect(state.defaultSelectValue);
+            }
+          } else {
+            defaultSelect(state.defaultSelectValue);
+          }
+        }
+      },
+      { deep: true }
+    );
+    watch(
+      () => props.radioSelectValLabel,
+      (val) => {
+        if (val) findLabel();
+      },
+      { deep: true }
+    );
+    onMounted(() => {
+      var _a;
+      if (state.defaultSelectValue && state.defaultSelectValue.length > 0 && isDefaultSelectVal.value) {
+        defaultSelect(state.defaultSelectValue);
+      }
+      if (props.selfExpanded) {
+        selectRef.value.expanded = true;
+      }
+      if (props.useVirtual) {
+        saveDATA.value = props.table.data;
+        isShowFirstRadio.value = false;
+        getDom(props);
+        (_a = scrollContainerEl.value) == null ? void 0 : _a.addEventListener("scroll", handleScroll);
+      }
+      if (props.radioSelectValLabel) findLabel();
+    });
+    const updateRenderData = (scrollTop) => {
+      let startIndex = 0;
+      let offsetHeight = 0;
+      for (let i = 0; i < saveDATA.value.length; i++) {
+        offsetHeight += getItemHeightFromCache(i);
+        if (offsetHeight >= scrollTop) {
+          startIndex = i;
+          break;
+        }
+      }
+      state.tableData = saveDATA.value.slice(startIndex, startIndex + props.virtualShowSize);
+      updateRenderedItemCache(startIndex);
+      updateOffset(offsetHeight - getItemHeightFromCache(startIndex));
+    };
+    const handleScroll = (e) => {
+      scrollTopNum.value = e.target.scrollTop;
+      updateRenderData(scrollTopNum.value);
+    };
+    onBeforeUnmount(() => {
+      var _a;
+      if (props.useVirtual) {
+        (_a = scrollContainerEl.value) == null ? void 0 : _a.removeEventListener("scroll", handleScroll);
+      }
+    });
+    onUpdated(() => {
+      if (props.isShowQuery) {
+        selectTable.value.doLayout();
+      }
+    });
+    const visibleChange = (visible) => {
+      var _a;
+      isVisible.value = visible;
+      if (isQueryVisible.value) {
+        selectRef.value.expanded = true;
+      }
+      if (visible) {
+        if (state.defaultSelectValue && state.defaultSelectValue.length > 0 && isDefaultSelectVal.value) {
+          defaultSelect(state.defaultSelectValue);
+        }
+        initTableData();
+        if (props.useVirtual) {
+          saveDATA.value = props.table.data;
+          updateRenderData(scrollTopNum.value);
+        }
+      } else {
+        if (fQueryConditionRef.value && props.isShowQuery && props.isClearQuery && !selectRef.value.expanded && !props.selfExpanded) {
+          (_a = fQueryConditionRef.value) == null ? void 0 : _a.resetData();
+        }
+        findLabel();
+        filterMethodHandle("");
+        if (props.useVirtual) {
+          state.tableData = [];
+          saveDATA.value = [];
+        }
+      }
+      if (props.selfExpanded) {
+        selectRef.value.expanded = true;
+      }
+    };
+    const handleEvent = () => {
+      selectRef.value.expanded = true;
+    };
+    const queryVisibleChange = (val) => {
+      isQueryVisible.value = val;
+    };
+    const closeBox = () => {
+      var _a, _b;
+      if (fQueryConditionRef.value && props.isShowQuery) {
+        selectRef.value.expanded = true;
+        Object.values((_b = (_a = fQueryConditionRef.value) == null ? void 0 : _a.props) == null ? void 0 : _b.opts).map((val) => {
+          if (val.comp.includes("select") || val.comp.includes("picker") || val.comp.includes("date")) {
+            val.eventHandle = {
+              "visible-change": ($event) => queryVisibleChange($event)
+            };
+            selectRef.value.expanded = true;
+          }
+        });
+        if (isVisible.value && props.isShowQuery) {
+          selectRef.value.expanded = true;
+        } else {
+          selectRef.value.expanded = false;
+        }
+      }
+    };
+    const attrs = useAttrs();
+    const selectKeyup = (e) => {
+      var _a, _b;
+      if (!props.multiple && props.isKeyup && state.tableData.length > 0) {
+        const newIndex = nowIndex.value * 1;
+        const nextIndex = e.keyCode === 40 ? newIndex + 1 : e.keyCode === 38 ? newIndex - 1 : newIndex;
+        const rowHeight = ((_a = selectTable.value.$el.querySelectorAll(".el-table__row")[0]) == null ? void 0 : _a.clientHeight) || 0;
+        const headerHeight = ((_b = selectTable.value.$el.querySelectorAll(".el-table__header")[0]) == null ? void 0 : _b.clientHeight) || 0;
+        const attrsMaxHeight = (typeof (attrs["max-height"] || attrs["maxHeight"]) === "number" ? attrs["max-height"] || attrs["maxHeight"] : parseFloat(attrs["max-height"] || attrs["maxHeight"])) || 0;
+        const maxHeight = attrsMaxHeight ? attrsMaxHeight - headerHeight : 0;
+        const height = rowHeight * (nextIndex + 3);
+        const scrollTop = height > maxHeight ? height - maxHeight : 0;
+        if (attrsMaxHeight) {
+          selectTable.value.setScrollTop(scrollTop);
+        }
+        const validNextIndex = Math.max(0, Math.min(nextIndex, state.tableData.length - 1));
+        selectTable.value.setCurrentRow(state.tableData[validNextIndex]);
+        nowIndex.value = validNextIndex;
+        if (e.keyCode === 13) {
+          rowClick(state.tableData[validNextIndex]);
+        }
+      }
+    };
+    const findLabel = () => {
+      nextTick(() => {
+        var _a;
+        if (props.multiple) {
+          (_a = selectRef.value.selected) == null ? void 0 : _a.forEach((item) => {
+            item.currentLabel = item.value;
+          });
+        } else {
+          if (props.isRadioEchoLabel) {
+            selectDefaultLabel.value = state.defaultValue && state.defaultValue[props.keywords.label] || props.radioSelectValLabel;
+          } else {
+            selectDefaultLabel.value = state.defaultValue && state.defaultValue[props.keywords.label] || "";
+          }
+        }
+      });
+    };
+    const handlesCurrentChange = (val) => {
+      if (props.multiple) {
+        if (!props.reserveSelection) {
+          clear();
+        }
+      } else {
+        reset();
+      }
+      emits("page-change", val);
+    };
+    const reset = () => {
+      if (!props.multiple) {
+        selectTable.value.setCurrentRow(-1);
+        nowIndex.value = -1;
+        radioVal.value = "";
+        isDefaultSelectVal.value = true;
+        forbidden.value = false;
+      }
+    };
+    const defaultSelect = (defaultSelectVal) => {
+      if (props.multiple) {
+        const multipleList = defaultSelectVal.map((val) => state.tableData.find((row) => row[props.keywords.value] === val)).filter(Boolean);
+        setTimeout(() => {
+          var _a, _b;
+          state.defaultValue = multipleList.map((item) => item[props.keywords.label]);
+          multipleList.forEach((row) => {
+            selectTable.value.toggleRowSelection(row, true);
+          });
+          (_b = (_a = selectRef.value) == null ? void 0 : _a.selected) == null ? void 0 : _b.forEach((item) => {
+            item.currentLabel = item.value;
+          });
+        }, 0);
+      } else {
+        setTimeout(() => {
+          const row = state.tableData.find((item) => item[props.keywords.value] === defaultSelectVal[0]);
+          if (row) {
+            radioVal.value = state.tableData.indexOf(row) + 1;
+            state.defaultValue = row;
+            selectDefaultLabel.value = row[props.keywords.label];
+            if (!props.defaultValIsOpenRadioChange) {
+              emits("radioChange", row, row[props.keywords.value]);
+            }
+          }
+        }, 0);
+      }
+    };
+    const handlesSelectionChange = (val) => {
+      isDefaultSelectVal.value = false;
+      state.defaultValue = val.map((item) => item[props.keywords.label]);
+      state.ids = val.map((item) => item[props.keywords.value]);
+      if (val.length === 0) {
+        isDefaultSelectVal.value = true;
+        state.defaultSelectValue = [];
+      }
+      emits("selectionChange", val, state.ids);
+    };
+    const getRowClassName = ({ row }) => {
+      if (!props.multiple && JSON.stringify(row) === JSON.stringify(state.defaultValue)) {
+        return "selected_row_style";
+      }
+      return "";
+    };
+    const getRowKey = (row) => {
+      return row[props.keywords.value];
+    };
+    const filterMethodHandle = (val) => {
+      var _a;
+      if (!props.filterable) return;
+      if (props.filterable && props.remote && typeof props.remoteMethod === "function") {
+        props.remoteMethod(val);
+        return;
+      }
+      const tableData = JSON.parse(JSON.stringify((_a = props.table) == null ? void 0 : _a.data));
+      if (!tableData || tableData.length === 0) return;
+      if (!props.multiple) {
+        if (val) {
+          radioVal.value = "";
+        } else {
+          const defaultIndex = tableData.findIndex(
+            (item) => item[props.keywords.label] === selectDefaultLabel.value
+          );
+          if (defaultIndex !== -1) {
+            radioVal.value = defaultIndex + 1;
+          }
+        }
+      }
+      state.tableData = tableData.filter((item) => {
+        var _a2;
+        return (_a2 = item[props.keywords.label]) == null ? void 0 : _a2.includes(val);
+      });
+      if (selectDefaultLabel.value) {
+        const defaultIndex = state.tableData.findIndex(
+          (item) => item[props.keywords.label] === selectDefaultLabel.value
+        );
+        if (defaultIndex !== -1) {
+          radioVal.value = defaultIndex + 1;
+        }
+      }
+    };
+    const initTableData = () => {
+      nextTick(() => {
+        var _a, _b;
+        if (props.multiple) {
+          (_a = state.defaultValue) == null ? void 0 : _a.forEach((row) => {
+            const matchedRow = state.tableData.find(
+              (item) => item[props.keywords.value] === row[props.keywords.value]
+            );
+            if (matchedRow) {
+              selectTable.value.toggleRowSelection(matchedRow, true);
+            }
+          });
+        } else {
+          const matchedRow = (_b = state.tableData) == null ? void 0 : _b.find(
+            (item) => item[props.keywords.value] === selectDefaultLabel.value
+          );
+          if (matchedRow) {
+            selectTable.value.setCurrentRow(matchedRow);
+          }
+        }
+      });
+    };
+    const copyToClipboard = async (text) => {
+      if (typeof text !== "string" || text.trim() === "") {
+        throw new Error(t("plus.copy.invalidCopyContent"));
+      }
+      try {
+        await navigator.clipboard.writeText(text);
+      } catch (error) {
+        throw new Error(t("plus.copy.copyFail"));
+      }
+    };
+    const showMessage = (type, message) => {
+      if (type === "success") {
+        ElMessage.success(message);
+      } else {
+        ElMessage.error(message);
+      }
+    };
+    const cellDblclick = async (row, column) => {
+      const value = row[column.property];
+      try {
+        await copyToClipboard(String(value));
+        showMessage("success", t("plus.copy.copySuccess"));
+      } catch (error) {
+        showMessage("error", error.message || t("plus.copy.copyFail"));
+      }
+    };
+    const radioChangeHandle = (event, row, index) => {
+      event.preventDefault();
+      if (row.isRadioDisabled) return;
+      isDefaultSelectVal.value = false;
+      radioClick(row, index);
+    };
+    const isForbidden = () => {
+      forbidden.value = false;
+      setTimeout(() => {
+        forbidden.value = true;
+      }, 0);
+    };
+    const radioClick = (row, index) => {
+      forbidden.value = !forbidden.value;
+      if (radioVal.value === index) {
+        if (!props.radioSameIsCancel) return;
+        clear();
+      } else {
+        updateState(row, index);
+      }
+      if (props.isExpanded && state.defaultValue) {
+        selectDefaultLabel.value = state.defaultValue[props.keywords.label] || "";
+        selectRef.value.expanded = true;
+      } else {
+        blur();
+      }
+    };
+    const updateState = (row, index) => {
+      isForbidden();
+      radioVal.value = index;
+      state.defaultValue = row;
+      emits("radioChange", row, row[props.keywords.value]);
+    };
+    const rowClick = async (row) => {
+      var _a;
+      if (row.isRadioDisabled) return;
+      if (!props.rowClickRadio) return;
+      if (!props.multiple) {
+        const rowIndex = (_a = props.table) == null ? void 0 : _a.data.findIndex(
+          (item) => item[props.keywords.value] === row[props.keywords.value]
+        );
+        if (rowIndex !== -1) {
+          isDefaultSelectVal.value = false;
+          await radioClick(row, rowIndex + 1);
+          if (radioVal.value) {
+            isRadio.value = true;
+          } else {
+            isRadio.value = false;
+          }
+        }
+      }
+    };
+    const removeTag = (tag) => {
+      const row = state.tableData.find(
+        (item) => item[props.keywords.label] === tag
+      );
+      row && selectTable.value.toggleRowSelection(row, false);
+      isDefaultSelectVal.value = true;
+    };
+    const clear = () => {
+      const resetDefaultState = () => {
+        isDefaultSelectVal.value = true;
+        state.defaultSelectValue = [];
+        state.defaultValue = props.multiple ? [] : null;
+      };
+      if (!selectTable.value) {
+        console.warn("selectTable.value is not initialized");
+        return;
+      }
+      if (props.multiple === true) {
+        try {
+          selectTable.value.clearSelection();
+        } catch (error) {
+          console.error("Failed to clear selection:", error);
+        }
+        resetDefaultState();
+      } else if (props.multiple === false) {
+        try {
+          selectTable.value.setCurrentRow(-1);
+        } catch (error) {
+          console.error("Failed to set current row:", error);
+        }
+        nowIndex.value = -1;
+        radioVal.value = "";
+        forbidden.value = false;
+        selectDefaultLabel.value = null;
+        resetDefaultState();
+        emits("radioChange", null, null);
+      } else {
+        console.warn("Invalid value for props.multiple:", props.multiple);
+      }
+    };
+    const blur = () => {
+      selectRef.value.blur();
+    };
+    const focus = () => {
+      selectRef.value.focus();
+    };
+    const isShowSlot = (name) => {
+      return Object.keys(slots).includes(name);
+    };
+    __expose({
+      focus,
+      blur,
+      clear,
+      props,
+      state,
+      fQueryConditionRef,
+      selectRef,
+      selectTable
+    });
+    return (_ctx, _cache) => {
+      const _component_el_input = resolveComponent("el-input");
+      const _component_el_button = resolveComponent("el-button");
+      const _component_el_table_column = resolveComponent("el-table-column");
+      const _component_el_radio = resolveComponent("el-radio");
+      const _component_el_table = resolveComponent("el-table");
+      const _component_el_pagination = resolveComponent("el-pagination");
+      const _component_el_select = resolveComponent("el-select");
+      const _directive_loading = resolveDirective("loading");
+      return __props.isShowInput ? (openBlock(), createBlock(_component_el_input, mergeProps({
+        key: 0,
+        modelValue: unref(selectInputVal),
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(selectInputVal) ? selectInputVal.value = $event : selectInputVal = $event)
+      }, { clearable: true, ...__props.inputAttr }, {
+        onFocus: _cache[1] || (_cache[1] = () => emits("input-focus")),
+        onBlur: _cache[2] || (_cache[2] = () => emits("input-blur")),
+        onClick: _cache[3] || (_cache[3] = () => emits("input-click")),
+        onClear: _cache[4] || (_cache[4] = () => emits("input-clear")),
+        style: { width: __props.inputWidth ? `${__props.inputWidth}px` : "100%" }
+      }), createSlots({
+        _: 2
+        /* DYNAMIC */
+      }, [
+        renderList(unref(slots), (_index, name) => {
+          return {
+            name,
+            fn: withCtx((data) => [
+              renderSlot(_ctx.$slots, name, normalizeProps(guardReactiveProps(data)))
+            ])
+          };
+        })
+      ]), 1040, ["modelValue", "style"])) : withDirectives((openBlock(), createBlock(_component_el_select, mergeProps({
+        key: 1,
+        ref_key: "selectRef",
+        ref: selectRef,
+        "model-value": __props.multiple ? state.defaultValue : selectDefaultLabel.value,
+        "popper-class": "t-select-table",
+        style: { width: __props.selectWidth ? `${__props.selectWidth}px` : "100%" },
+        "value-key": __props.keywords.value,
+        "filter-method": __props.filterMethod || filterMethodHandle,
+        onVisibleChange: visibleChange,
+        onRemoveTag: removeTag,
+        onClear: clear,
+        onKeyup: selectKeyup
+      }, { clearable: true, multiple: __props.multiple, filterable: __props.filterable, remote: __props.remote, remoteMethod: __props.remoteMethod, ..._ctx.$attrs }), {
+        empty: withCtx(() => [
+          createElementVNode(
+            "div",
+            {
+              class: "f-table-select__table",
+              style: normalizeStyle({ width: __props.tableWidth ? `${__props.tableWidth}px` : "100%" })
+            },
+            [
+              __props.isShowQuery ? (openBlock(), createElementBlock("div", _hoisted_1, [
+                createVNode(
+                  _sfc_main$1,
+                  mergeProps({
+                    ref_key: "fQueryConditionRef",
+                    ref: fQueryConditionRef,
+                    boolEnter: false,
+                    onHandleEvent: handleEvent
+                  }, _ctx.$attrs),
+                  createSlots({
+                    _: 2
+                    /* DYNAMIC */
+                  }, [
+                    renderList(unref(slots), (_index, name) => {
+                      return {
+                        name,
+                        fn: withCtx((data) => [
+                          renderSlot(_ctx.$slots, name, normalizeProps(guardReactiveProps(data)))
+                        ])
+                      };
+                    }),
+                    __props.isShowBlurBtn ? {
+                      name: "querybar",
+                      fn: withCtx(() => [
+                        createVNode(
+                          _component_el_button,
+                          mergeProps({ type: "danger", ...computedBtnBind.value }, { onClick: blur }),
+                          {
+                            default: withCtx(() => [
+                              createTextVNode(
+                                toDisplayString(computedBtnBind.value.btnTxt),
+                                1
+                                /* TEXT */
+                              )
+                            ]),
+                            _: 1
+                            /* STABLE */
+                          },
+                          16
+                          /* FULL_PROPS */
+                        ),
+                        renderSlot(_ctx.$slots, "querybar")
+                      ]),
+                      key: "0"
+                    } : void 0
+                  ]),
+                  1040
+                  /* FULL_PROPS, DYNAMIC_SLOTS */
+                )
+              ])) : createCommentVNode("v-if", true),
+              createElementVNode(
+                "div",
+                {
+                  class: "header_wrap",
+                  style: normalizeStyle({ paddingBottom: isShowSlot("toolbar") ? "10px" : 0 })
+                },
+                [
+                  renderSlot(_ctx.$slots, "toolbar")
+                ],
+                4
+                /* STYLE */
+              ),
+              withDirectives((openBlock(), createElementBlock("div", {
+                class: "table_content",
+                "element-loading-text": computedLoadingTxt.value
+              }, [
+                createVNode(_component_el_table, mergeProps({
+                  ref_key: "selectTable",
+                  ref: selectTable,
+                  data: state.tableData,
+                  class: {
+                    radioStyle: !__props.multiple,
+                    highlightCurrentRow: isRadio.value,
+                    keyUpStyle: __props.isKeyup,
+                    t_select_table_multiple: __props.useVirtual && __props.multiple,
+                    t_select_table_radio: __props.useVirtual && !__props.multiple
+                  },
+                  "row-class-name": getRowClassName,
+                  "row-key": getRowKey,
+                  onRowClick: rowClick,
+                  onCellDblclick: cellDblclick,
+                  onSelectionChange: handlesSelectionChange
+                }, { border: __props.border, size: __props.tableSize, "highlight-current-row": true, ..._ctx.$attrs }), {
+                  default: withCtx(() => [
+                    __props.multiple ? (openBlock(), createBlock(_component_el_table_column, {
+                      key: 0,
+                      type: "selection",
+                      width: __props.tableSize === "large" ? 65 : 55,
+                      align: __props.align || "center",
+                      "reserve-selection": __props.reserveSelection,
+                      selectable: __props.selectable,
+                      fixed: __props.multipleFixed
+                    }, null, 8, ["width", "align", "reserve-selection", "selectable", "fixed"])) : createCommentVNode("v-if", true),
+                    !__props.multiple && isShowFirstRadio.value ? (openBlock(), createBlock(_component_el_table_column, {
+                      key: 1,
+                      type: "radio",
+                      width: __props.tableSize === "large" ? 65 : 55,
+                      label: computedRadioTxt.value,
+                      fixed: __props.radioFixed,
+                      align: __props.align || "center"
+                    }, {
+                      default: withCtx((scope) => [
+                        createVNode(_component_el_radio, {
+                          modelValue: radioVal.value,
+                          "onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => radioVal.value = $event),
+                          label: scope.$index + 1,
+                          disabled: scope.row.isRadioDisabled,
+                          onClick: withModifiers(($event) => radioChangeHandle($event, scope.row, scope.$index + 1), ["stop"])
+                        }, null, 8, ["modelValue", "label", "disabled", "onClick"])
+                      ]),
+                      _: 1
+                      /* STABLE */
+                    }, 8, ["width", "label", "fixed", "align"])) : createCommentVNode("v-if", true),
+                    (openBlock(true), createElementBlock(
+                      Fragment,
+                      null,
+                      renderList(__props.columns, (item, index) => {
+                        return openBlock(), createBlock(_component_el_table_column, mergeProps({
+                          key: index + "i",
+                          type: item.type,
+                          label: item.label,
+                          prop: item.prop,
+                          "min-width": item["min-width"] || item.minWidth,
+                          width: item.width,
+                          align: item.align || __props.align || "center",
+                          fixed: item.fixed
+                        }, { ref_for: true }, { "show-overflow-tooltip": true, ...item.bind }), {
+                          default: withCtx((scope) => [
+                            item.render ? (openBlock(), createBlock(_sfc_main$2, {
+                              key: 0,
+                              column: item,
+                              row: scope.row,
+                              render: item.render,
+                              index: scope.$index
+                            }, null, 8, ["column", "row", "render", "index"])) : createCommentVNode("v-if", true),
+                            item.slotName ? renderSlot(_ctx.$slots, item.slotName, {
+                              key: 1,
+                              scope
+                            }) : createCommentVNode("v-if", true),
+                            !item.render && !item.slotName ? (openBlock(), createElementBlock("div", _hoisted_3, [
+                              createElementVNode(
+                                "span",
+                                null,
+                                toDisplayString(scope.row[item.prop]),
+                                1
+                                /* TEXT */
+                              )
+                            ])) : createCommentVNode("v-if", true)
+                          ]),
+                          _: 2
+                          /* DYNAMIC */
+                        }, 1040, ["type", "label", "prop", "min-width", "width", "align", "fixed"]);
+                      }),
+                      128
+                      /* KEYED_FRAGMENT */
+                    )),
+                    renderSlot(_ctx.$slots, "default")
+                  ]),
+                  _: 3
+                  /* FORWARDED */
+                }, 16, ["data", "class"]),
+                __props.isShowPagination ? (openBlock(), createElementBlock("div", _hoisted_4, [
+                  createVNode(_component_el_pagination, mergeProps({
+                    "current-page": __props.table.currentPage,
+                    "onUpdate:currentPage": _cache[6] || (_cache[6] = ($event) => __props.table.currentPage = $event),
+                    "page-size": __props.table.pageSize,
+                    "onUpdate:pageSize": _cache[7] || (_cache[7] = ($event) => __props.table.pageSize = $event),
+                    onCurrentChange: handlesCurrentChange,
+                    layout: "total, prev, pager, next, jumper",
+                    "pager-count": __props.table["pager-count"] || 5,
+                    total: __props.table.total
+                  }, { background: true, size: __props.paginationSize || "small", ..._ctx.$attrs }), null, 16, ["current-page", "page-size", "pager-count", "total"])
+                ])) : createCommentVNode("v-if", true)
+              ], 8, _hoisted_2)), [
+                [_directive_loading, __props.tableLoading]
+              ]),
+              renderSlot(_ctx.$slots, "footer")
+            ],
+            4
+            /* STYLE */
+          )
+        ]),
+        _: 3
+        /* FORWARDED */
+      }, 16, ["model-value", "style", "value-key", "filter-method"])), [
+        [unref(vClickOutside), closeBox]
+      ]);
+    };
+  }
+});
+
+export { _sfc_main as default };