@fmdevui/fm-dev 1.0.76 → 1.0.78

package/es/packages/core/ui/components/selecttable/index.vue2.mjs

@@ -0,0 +1,816 @@
+import { defineComponent, useSlots, ref, computed, reactive, watch, nextTick, onMounted, onBeforeUnmount, onUpdated, useAttrs, resolveComponent, resolveDirective, createBlock, withDirectives, openBlock, mergeProps, isRef, unref, createSlots, renderList, withCtx, renderSlot, normalizeProps, guardReactiveProps, createElementVNode, normalizeStyle, createElementBlock, createCommentVNode, createVNode, createTextVNode, toDisplayString, withModifiers, Fragment } from 'vue';
+import '../querycondition/index.vue.mjs';
+import './renderCol.vue.mjs';
+import { ElMessage } from 'element-plus';
+import ClickOutside from './ClickOutside.mjs';
+import { useVirtualized } from './useVirtualized.mjs';
+import _sfc_main$1 from '../querycondition/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: "fm-table-select__page"
+};
+var _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "TSelectTable"
+  },
+  __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: "\u5173\u95ED\u4E0B\u62C9\u6846" }) },
+    align: { default: "center" },
+    reserveSelection: { type: Boolean, default: true },
+    selectable: { type: Function, default: void 0 },
+    multipleFixed: { type: [String, Boolean], default: true },
+    radioTxt: { default: "\u5355\u9009" },
+    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: "\u52A0\u8F7D\u4E2D..." }
+  },
+  emits: ["page-change", "selectionChange", "radioChange", "update:inputValue", "input-focus", "input-blur", "input-clear", "input-click"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    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 selectRef = ref(null);
+    const selectTable = ref(null);
+    const tQueryConditionRef = ref(null);
+    const nowIndex = ref(-1);
+    const tableDataLabelList = computed(() => {
+      return state.tableData.map((item) => item[props.keywords.label]);
+    });
+    watch(
+      () => props.table.data,
+      (val) => {
+        if (props.useVirtual) {
+          saveDATA.value = val;
+          updateRenderData(scrollTopNum.value);
+        } else {
+          state.tableData = val;
+          if (props.multiple && props.multipleDisableDelete) {
+            selectRef.value?.$el?.querySelectorAll(".el-tag").forEach((item) => {
+              if (tableDataLabelList.value?.includes(
+                item.querySelector(".el-select__tags-text")?.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(() => {
+      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);
+        scrollContainerEl.value?.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(() => {
+      if (props.useVirtual) {
+        scrollContainerEl.value?.removeEventListener("scroll", handleScroll);
+      }
+    });
+    onUpdated(() => {
+      if (props.isShowQuery) {
+        selectTable.value.doLayout();
+      }
+    });
+    const visibleChange = (visible) => {
+      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 (tQueryConditionRef.value && props.isShowQuery && props.isClearQuery && !selectRef.value.expanded && !props.selfExpanded) {
+          tQueryConditionRef.value?.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 = () => {
+      if (tQueryConditionRef.value && props.isShowQuery) {
+        selectRef.value.expanded = true;
+        Object.values(tQueryConditionRef.value?.props?.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) => {
+      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 = selectTable.value.$el.querySelectorAll(".el-table__row")[0]?.clientHeight || 0;
+        const headerHeight = selectTable.value.$el.querySelectorAll(".el-table__header")[0]?.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(() => {
+        if (props.multiple) {
+          selectRef.value.selected?.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(() => {
+          state.defaultValue = multipleList.map((item) => item[props.keywords.label]);
+          multipleList.forEach((row) => {
+            selectTable.value.toggleRowSelection(row, true);
+          });
+          selectRef.value?.selected?.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) => {
+      if (!props.filterable) return;
+      if (props.filterable && props.remote && typeof props.remoteMethod === "function") {
+        props.remoteMethod(val);
+        return;
+      }
+      const tableData = JSON.parse(JSON.stringify(props.table?.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) => {
+        return item[props.keywords.label]?.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(() => {
+        if (props.multiple) {
+          state.defaultValue?.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 = state.tableData?.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("\u65E0\u6548\u7684\u590D\u5236\u5185\u5BB9");
+      }
+      try {
+        await navigator.clipboard.writeText(text);
+      } catch (error) {
+        if (error.name === "NotAllowedError" || error.name === "SecurityError") {
+          throw new Error("\u590D\u5236\u5931\u8D25\uFF1A\u6743\u9650\u88AB\u62D2\u7EDD");
+        } else {
+          throw new Error("\u590D\u5236\u5931\u8D25\uFF1A\u6D4F\u89C8\u5668\u4E0D\u652F\u6301\u6216\u53D1\u751F\u672A\u77E5\u9519\u8BEF");
+        }
+      }
+    };
+    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", "\u590D\u5236\u6210\u529F");
+      } catch (error) {
+        showMessage("error", error.message || "\u590D\u5236\u5931\u8D25");
+      }
+    };
+    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) => {
+      if (row.isRadioDisabled) return;
+      if (!props.rowClickRadio) return;
+      if (!props.multiple) {
+        const rowIndex = props.table?.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,
+      tQueryConditionRef,
+      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 _ctx.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, ..._ctx.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: _ctx.inputWidth ? `${_ctx.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": _ctx.multiple ? state.defaultValue : selectDefaultLabel.value,
+        "popper-class": "fm-select-table",
+        style: { width: _ctx.selectWidth ? `${_ctx.selectWidth}px` : "100%" },
+        "value-key": _ctx.keywords.value,
+        "filter-method": _ctx.filterMethod || filterMethodHandle,
+        onVisibleChange: visibleChange,
+        onRemoveTag: removeTag,
+        onClear: clear,
+        onKeyup: selectKeyup
+      }, { clearable: true, multiple: _ctx.multiple, filterable: _ctx.filterable, remote: _ctx.remote, remoteMethod: _ctx.remoteMethod, ..._ctx.$attrs }), {
+        empty: withCtx(() => [
+          createElementVNode(
+            "div",
+            {
+              class: "fm-table-select__table",
+              style: normalizeStyle({ width: _ctx.tableWidth ? `${_ctx.tableWidth}px` : "100%" })
+            },
+            [
+              _ctx.isShowQuery ? (openBlock(), createElementBlock("div", _hoisted_1, [
+                createVNode(
+                  _sfc_main$1,
+                  mergeProps({
+                    ref_key: "tQueryConditionRef",
+                    ref: tQueryConditionRef,
+                    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)))
+                        ])
+                      };
+                    }),
+                    _ctx.isShowBlurBtn ? {
+                      name: "querybar",
+                      fn: withCtx(() => [
+                        createVNode(
+                          _component_el_button,
+                          mergeProps({ type: "danger", ..._ctx.btnBind }, { onClick: blur }),
+                          {
+                            default: withCtx(() => [
+                              createTextVNode(
+                                toDisplayString(_ctx.btnBind.btnTxt || "\u5173\u95ED\u4E0B\u62C9\u6846"),
+                                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": _ctx.loadingTxt
+              }, [
+                createVNode(_component_el_table, mergeProps({
+                  ref_key: "selectTable",
+                  ref: selectTable,
+                  data: state.tableData,
+                  class: {
+                    radioStyle: !_ctx.multiple,
+                    highlightCurrentRow: isRadio.value,
+                    keyUpStyle: _ctx.isKeyup,
+                    fm_select_table_multiple: _ctx.useVirtual && _ctx.multiple,
+                    fm_select_table_radio: _ctx.useVirtual && !_ctx.multiple
+                  },
+                  "row-class-name": getRowClassName,
+                  "row-key": getRowKey,
+                  onRowClick: rowClick,
+                  onCellDblclick: cellDblclick,
+                  onSelectionChange: handlesSelectionChange
+                }, { border: _ctx.border, size: _ctx.tableSize, "highlight-current-row": true, ..._ctx.$attrs }), {
+                  default: withCtx(() => [
+                    _ctx.multiple ? (openBlock(), createBlock(_component_el_table_column, {
+                      key: 0,
+                      type: "selection",
+                      width: _ctx.tableSize === "large" ? 65 : 55,
+                      align: _ctx.align || "center",
+                      "reserve-selection": _ctx.reserveSelection,
+                      selectable: _ctx.selectable,
+                      fixed: _ctx.multipleFixed
+                    }, null, 8, ["width", "align", "reserve-selection", "selectable", "fixed"])) : createCommentVNode("v-if", true),
+                    !_ctx.multiple && isShowFirstRadio.value ? (openBlock(), createBlock(_component_el_table_column, {
+                      key: 1,
+                      type: "radio",
+                      width: _ctx.tableSize === "large" ? 65 : 55,
+                      label: _ctx.radioTxt,
+                      fixed: _ctx.radioFixed,
+                      align: _ctx.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(_ctx.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 || _ctx.align || "center",
+                          fixed: item.fixed
+                        }, { ref_for: true }, { "show-overflow-tooltip": true, ...item.bind }), {
+                          default: withCtx((scope) => [
+                            createCommentVNode(" render\u65B9\u5F0F "),
+                            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),
+                            createCommentVNode(" \u4F5C\u7528\u57DF\u63D2\u69FD "),
+                            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"]),
+                _ctx.isShowPagination ? (openBlock(), createElementBlock("div", _hoisted_4, [
+                  createVNode(_component_el_pagination, mergeProps({
+                    "current-page": _ctx.table.currentPage,
+                    "onUpdate:currentPage": _cache[6] || (_cache[6] = ($event) => _ctx.table.currentPage = $event),
+                    "page-size": _ctx.table.pageSize,
+                    "onUpdate:pageSize": _cache[7] || (_cache[7] = ($event) => _ctx.table.pageSize = $event),
+                    onCurrentChange: handlesCurrentChange,
+                    layout: "total, prev, pager, next, jumper",
+                    "pager-count": _ctx.table["pager-count"] || 5,
+                    total: _ctx.table.total
+                  }, { background: true, size: _ctx.paginationSize || "small", ..._ctx.$attrs }), null, 16, ["current-page", "page-size", "pager-count", "total"])
+                ])) : createCommentVNode("v-if", true)
+              ], 8, _hoisted_2)), [
+                [_directive_loading, _ctx.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 };