@blueking/ediatable 0.0.1-beta.3 → 0.0.1-beta.5

package/vue2/index.es.min.js

@@ -1,5 +1,5 @@
 import * as __WEBPACK_EXTERNAL_MODULE_vue__ from "@blueking/bkui-library";
-import { ref, provide, onMounted, onBeforeUnmount, defineComponent, openBlock, createElementBlock, createElementVNode, renderSlot, reactive, toRefs, h as h$1, mergeModels, useModel, useAttrs, useSlots, resolveDirective, normalizeClass, unref, createVNode, mergeProps, createSlots, withCtx, withDirectives, createCommentVNode, computed, createBlock, inject, getCurrentScope, onScopeDispose, watch, getCurrentInstance, normalizeStyle, Fragment, renderList, nextTick, toDisplayString, createApp } from "@blueking/bkui-library";
+import { ref, provide, onMounted, onBeforeUnmount, getCurrentScope, onScopeDispose, unref, computed, watch, getCurrentInstance, defineComponent, useSlots, inject, resolveDirective, openBlock, createElementBlock, normalizeClass, normalizeStyle, withDirectives, renderSlot, createElementVNode, createCommentVNode, createBlock, Fragment, renderList, withCtx, createTextVNode, toDisplayString, reactive, toRefs, h as h$1, mergeModels, useModel, useAttrs, createVNode, mergeProps, createSlots, nextTick, createApp } from "@blueking/bkui-library";
 var commonjsGlobal = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
 function getDefaultExportFromCjs(x3) {
   return x3 && x3.__esModule && Object.prototype.hasOwnProperty.call(x3, "default") ? x3["default"] : x3;
@@ -5488,7 +5488,7 @@ lodash.exports;
 var lodashExports = lodash.exports;
 const _$1 = /* @__PURE__ */ getDefaultExportFromCjs(lodashExports);
 !function() {
-  var svgCode = '<svg xmlns="http://www.w3.org/2000/svg" data-name="ediatable" xmlns:xlink="http://www.w3.org/1999/xlink" style="position:absolute;width:0;height:0;visibility:hidden"><symbol id="icon-exclamation-fill" viewBox="0 0 64 64"><path fill="#737987" d="M32 4C16.5 4 4 16.5 4 32s12.5 28 28 28 28-12.5 28-28S47.5 4 32 4zm0 44c-1.7 0-3-1.3-3-3s1.3-3 3-3 3 1.3 3 3-1.3 3-3 3zm3-28.7L34 38c0 1.1-.9 2-2 2s-2-.9-2-2l-1-18.7V19c0-1.7 1.3-3 3-3s3 1.3 3 3v.3z"/></symbol><symbol id="icon-minus-fill" viewBox="0 0 1024 1024"><path d="M512 64C264 64 64 264 64 512s200 448 448 448 448-200 448-448S760 64 512 64zm224 480H288v-64h448v64z"/></symbol><symbol id="icon-plus-fill" viewBox="0 0 1024 1024"><path d="M512 64C264 64 64 264 64 512s200 448 448 448 448-200 448-448S760 64 512 64zm224 480H544v192h-64V544H288v-64h192V288h64v192h192v64z"/></symbol></svg>';
+  var svgCode = '<svg xmlns="http://www.w3.org/2000/svg" data-name="ediatable" xmlns:xlink="http://www.w3.org/1999/xlink" style="position:absolute;width:0;height:0;visibility:hidden"><symbol id="icon-exclamation-fill" viewBox="0 0 64 64"><path fill="#737987" d="M32 4C16.5 4 4 16.5 4 32s12.5 28 28 28 28-12.5 28-28S47.5 4 32 4zm0 44c-1.7 0-3-1.3-3-3s1.3-3 3-3 3 1.3 3 3-1.3 3-3 3zm3-28.7L34 38c0 1.1-.9 2-2 2s-2-.9-2-2l-1-18.7V19c0-1.7 1.3-3 3-3s3 1.3 3 3v.3z"/></symbol><symbol id="icon-copy" viewBox="0 0 1024 1024"><path d="M864 128H288c-17.6 0-32 14.4-32 32v96h-96c-17.6 0-32 14.4-32 32v576c0 17.6 14.4 32 32 32h576c17.6 0 32-14.4 32-32v-96h96c17.6 0 32-14.4 32-32V160c0-17.6-14.4-32-32-32zM704 704v128H192V320h512v384zm128 0h-64V288c0-17.6-14.4-32-32-32H320v-64h512v512z"/><path d="M275.2 419.2h336v64h-336zM272 544h336v64H272zM272 672h336v64H272z"/></symbol><symbol id="icon-minus-fill" viewBox="0 0 1024 1024"><path d="M512 64C264 64 64 264 64 512s200 448 448 448 448-200 448-448S760 64 512 64zm224 480H288v-64h448v64z"/></symbol><symbol id="icon-plus-fill" viewBox="0 0 1024 1024"><path d="M512 64C264 64 64 264 64 512s200 448 448 448 448-200 448-448S760 64 512 64zm224 480H544v192h-64V544H288v-64h192V288h64v192h192v64z"/></symbol></svg>';
   if (document.body) {
     document.body.insertAdjacentHTML("afterbegin", svgCode);
   } else {
@@ -5622,11 +5622,208 @@ function useColumnResize(tableRef, tableColumnResizeRef, mouseupCallback) {
     handleMouseMove
   };
 }
-const _hoisted_1$7 = { style: { "position": "relative" } };
-const renderTablekey = Symbol("renderTable");
+const random$1 = () => `${_$1.random(0, 999999)}_${Date.now()}_${_$1.random(0, 999999)}`;
+const encodeMult = (text) => {
+  const temp = document.createElement("textarea");
+  temp.value = text;
+  return temp.value;
+};
+function tryOnScopeDispose(fn2) {
+  if (getCurrentScope()) {
+    onScopeDispose(fn2);
+    return true;
+  }
+  return false;
+}
+function toValue(r2) {
+  return typeof r2 === "function" ? r2() : unref(r2);
+}
+const isClient = typeof window !== "undefined" && typeof document !== "undefined";
+typeof WorkerGlobalScope !== "undefined" && globalThis instanceof WorkerGlobalScope;
+function unrefElement(elRef) {
+  var _a;
+  const plain = toValue(elRef);
+  return (_a = plain == null ? void 0 : plain.$el) != null ? _a : plain;
+}
+const defaultWindow = isClient ? window : void 0;
+function useMounted() {
+  const isMounted = ref(false);
+  const instance2 = getCurrentInstance();
+  if (instance2) {
+    onMounted(() => {
+      isMounted.value = true;
+    }, instance2);
+  }
+  return isMounted;
+}
+function useSupported(callback) {
+  const isMounted = useMounted();
+  return computed(() => {
+    isMounted.value;
+    return Boolean(callback());
+  });
+}
+function useResizeObserver(target, callback, options = {}) {
+  const { window: window2 = defaultWindow, ...observerOptions } = options;
+  let observer;
+  const isSupported = useSupported(() => window2 && "ResizeObserver" in window2);
+  const cleanup = () => {
+    if (observer) {
+      observer.disconnect();
+      observer = void 0;
+    }
+  };
+  const targets = computed(() => Array.isArray(target) ? target.map((el) => unrefElement(el)) : [unrefElement(target)]);
+  const stopWatch = watch(
+    targets,
+    (els) => {
+      cleanup();
+      if (isSupported.value && window2) {
+        observer = new ResizeObserver(callback);
+        for (const _el of els)
+          _el && observer.observe(_el, observerOptions);
+      }
+    },
+    { immediate: true, flush: "post" }
+  );
+  const stop = () => {
+    cleanup();
+    stopWatch();
+  };
+  tryOnScopeDispose(stop);
+  return {
+    isSupported,
+    stop
+  };
+}
+const _hoisted_1$6 = ["data-fixed", "data-maxWidth", "data-minWidth", "data-width"];
+const _hoisted_2$2 = { class: "th-cell" };
+const _hoisted_3$1 = { style: { "display": "inline-block", "line-height": "40px", "vertical-align": "top" } };
 const _sfc_main$8 = /* @__PURE__ */ defineComponent({
+  __name: "head-column",
+  props: {
+    fixed: { default: void 0 },
+    maxWidth: { default: void 0 },
+    minWidth: { default: void 0 },
+    required: { type: Boolean, default: true },
+    width: { default: void 0 },
+    renderAppend: { type: Function, default: void 0 }
+  },
+  setup(__props) {
+    const props2 = __props;
+    const slots = useSlots();
+    const { rowWidth, isOverflow: isMinimize } = inject(renderTablekey);
+    const parentTable = inject(tableColumnResizekey);
+    const columnRef = ref();
+    const currentWidth = ref(0);
+    const columnKey = random$1();
+    let initWidthRate = 0;
+    let isDragedSelf = false;
+    const finalMinWidth = computed(() => props2.minWidth ? props2.minWidth : props2.width ?? 100);
+    const isFixedRight = computed(() => props2.fixed === "right");
+    const isFixedLeft = computed(() => props2.fixed === "left");
+    const styles = computed(() => {
+      if (props2.width && (rowWidth == null ? void 0 : rowWidth.value) && finalMinWidth.value) {
+        const newWidth = rowWidth.value * initWidthRate;
+        if (newWidth !== props2.width) {
+          let width = 0;
+          if (isMinimize == null ? void 0 : isMinimize.value) {
+            if (currentWidth.value !== 0 && (currentWidth.value !== finalMinWidth.value || currentWidth.value !== props2.width)) {
+              width = currentWidth.value;
+            } else {
+              width = finalMinWidth.value;
+            }
+          } else if (newWidth > finalMinWidth.value) {
+            width = newWidth;
+          } else {
+            width = finalMinWidth.value;
+          }
+          return {
+            minWidth: `${width}px`
+          };
+        }
+      }
+      return {
+        minWidth: props2.width ? `${props2.width}px` : "120px"
+      };
+    });
+    const RenderAppendElement = computed(() => props2.renderAppend && props2.renderAppend());
+    watch(
+      () => [props2.width, rowWidth == null ? void 0 : rowWidth.value, currentWidth.value],
+      ([width, rowWidth2, currentWidth2]) => {
+        if (!isDragedSelf) {
+          return;
+        }
+        if (width && rowWidth2 && currentWidth2 && finalMinWidth.value) {
+          isDragedSelf = false;
+          if (currentWidth2 !== 0 && (currentWidth2 !== finalMinWidth.value || currentWidth2 !== width)) {
+            initWidthRate = currentWidth2 / rowWidth2;
+          } else {
+            initWidthRate = (isMinimize == null ? void 0 : isMinimize.value) ? finalMinWidth.value / rowWidth2 : width / rowWidth2;
+          }
+        }
+      },
+      {
+        immediate: true
+      }
+    );
+    useResizeObserver(columnRef, () => {
+      if (!isDragedSelf) {
+        return;
+      }
+      const width = parseFloat(columnRef.value.style.width);
+      currentWidth.value = width;
+    });
+    const handleMouseDown = (event) => {
+      isDragedSelf = true;
+      parentTable == null ? void 0 : parentTable.columnMousedown(event, {
+        columnKey,
+        minWidth: finalMinWidth.value
+      });
+    };
+    const handleMouseMove = (event) => {
+      parentTable == null ? void 0 : parentTable.columnMouseMove(event);
+    };
+    return (_ctx, _cache) => {
+      const _directive_overflow_tips = resolveDirective("overflow-tips");
+      return openBlock(), createElementBlock("th", {
+        ref_key: "columnRef",
+        ref: columnRef,
+        class: normalizeClass(["bk-ediatable-head-column", {
+          "is-required": _ctx.required,
+          [`column-${unref(columnKey)}`]: true,
+          "is-right-fixed": unref(isMinimize) && isFixedRight.value,
+          "is-left-fixed": unref(isMinimize) && isFixedLeft.value
+        }]),
+        "data-fixed": _ctx.fixed,
+        "data-maxWidth": _ctx.maxWidth,
+        "data-minWidth": finalMinWidth.value,
+        "data-width": _ctx.width,
+        style: normalizeStyle(styles.value),
+        onMousedown: handleMouseDown,
+        onMousemove: handleMouseMove
+      }, [
+        withDirectives((openBlock(), createElementBlock("div", _hoisted_2$2, [
+          renderSlot(_ctx.$slots, "default")
+        ])), [
+          [_directive_overflow_tips]
+        ]),
+        createElementVNode("div", _hoisted_3$1, [
+          unref(slots).append && !_ctx.renderAppend ? renderSlot(_ctx.$slots, "append", { key: 0 }) : createCommentVNode("v-if", true),
+          _ctx.renderAppend ? (openBlock(), createBlock(unref(RenderAppendElement), { key: 1 })) : createCommentVNode("v-if", true)
+        ])
+      ], 46, _hoisted_1$6);
+    };
+  }
+});
+const renderTablekey = Symbol("renderTable");
+const _sfc_main$7 = /* @__PURE__ */ defineComponent({
   __name: "ediatable",
+  props: {
+    theadList: { default: () => [] }
+  },
   setup(__props) {
+    const slots = useSlots();
     const checkTableScroll = () => {
       rowWidth.value = tableRef.value.clientWidth;
       isOverflow.value = tableOuterRef.value.clientWidth < tableRef.value.clientWidth;
@@ -5666,8 +5863,34 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
             },
             [
               createElementVNode("thead", null, [
-                createElementVNode("tr", _hoisted_1$7, [
-                  renderSlot(_ctx.$slots, "default")
+                createElementVNode("tr", null, [
+                  unref(slots).default && _ctx.theadList.length === 0 ? renderSlot(_ctx.$slots, "default", { key: 0 }) : (openBlock(true), createElementBlock(
+                    Fragment,
+                    { key: 1 },
+                    renderList(_ctx.theadList, (head, index2) => {
+                      return openBlock(), createBlock(_sfc_main$8, {
+                        key: index2,
+                        width: head.width,
+                        "min-width": head.minWidth,
+                        "max-width": head.maxWidth,
+                        fixed: head.fixed,
+                        required: head.required,
+                        "render-append": head.renderAppend
+                      }, {
+                        default: withCtx(() => [
+                          createTextVNode(
+                            toDisplayString(head.title),
+                            1
+                            /* TEXT */
+                          )
+                        ]),
+                        _: 2
+                        /* DYNAMIC */
+                      }, 1032, ["width", "min-width", "max-width", "fixed", "required", "render-append"]);
+                    }),
+                    128
+                    /* KEYED_FRAGMENT */
+                  ))
                 ])
               ]),
               createElementVNode("tbody", null, [
@@ -7904,7 +8127,7 @@ __webpack_require__$v.d(__webpack_exports__$v, {
   ),
   random: () => (
     /* reexport */
-    random$1
+    random
   ),
   renderDirectiveType: () => (
     /* reexport */
@@ -8690,7 +8913,7 @@ var throttle_x$1 = (y4) => {
 };
 const throttle_namespaceObject$1 = throttle_x$1({ ["default"]: () => throttle$1 });
 var lowerStr = "abcdefghijklmnopqrstuvwxyz0123456789";
-var random$1 = function random(n2) {
+var random = function random2(n2) {
   var str = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : lowerStr;
   var result = "";
   for (var i3 = 0; i3 < n2; i3++) {
@@ -47842,12 +48065,12 @@ const DbIcon = defineComponent({
     });
   }
 });
-const _hoisted_1$6 = {
+const _hoisted_1$5 = {
   key: 0,
   class: "input-error"
 };
-const _sfc_main$7 = /* @__PURE__ */ defineComponent({
-  __name: "date-time-picker",
+const _sfc_main$6 = /* @__PURE__ */ defineComponent({
+  __name: "date-time-picker-column",
   props: /* @__PURE__ */ mergeModels({
     placeholder: { default: "" },
     rules: { default: void 0 },
@@ -47914,7 +48137,7 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
               key: "0"
             } : void 0
           ]), 1040, ["model-value", "placeholder", "type"]),
-          unref(errorMessage) ? (openBlock(), createElementBlock("div", _hoisted_1$6, [
+          unref(errorMessage) ? (openBlock(), createElementBlock("div", _hoisted_1$5, [
             withDirectives(createVNode(
               unref(DbIcon),
               { type: "exclamation-fill" },
@@ -47932,18 +48155,12 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const random2 = () => `${_$1.random(0, 999999)}_${Date.now()}_${_$1.random(0, 999999)}`;
-const encodeMult = (text) => {
-  const temp = document.createElement("textarea");
-  temp.value = text;
-  return temp.value;
-};
-const _hoisted_1$5 = {
+const _hoisted_1$4 = {
   key: 1,
   class: "blur-dispaly-main"
 };
-const _sfc_main$6 = /* @__PURE__ */ defineComponent({
-  __name: "input",
+const _sfc_main$5 = /* @__PURE__ */ defineComponent({
+  __name: "input-column",
   props: /* @__PURE__ */ mergeModels({
     placeholder: { default: "请输入" },
     rules: { default: void 0 },
@@ -47951,7 +48168,8 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
     type: { default: "text" },
     min: { default: Number.MIN_SAFE_INTEGER },
     max: { default: Number.MAX_SAFE_INTEGER },
-    isShowBlur: { type: Boolean, default: false }
+    isShowBlur: { type: Boolean, default: false },
+    precision: { default: 0 }
   }, {
     "modelValue": {
       default: ""
@@ -48043,25 +48261,27 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
           }])
         },
         [
-          createVNode(unref(__webpack_exports__default$7), {
+          createVNode(unref(__webpack_exports__default$7), mergeProps({
             class: "input-box",
             disabled: _ctx.disabled,
             max: _ctx.max,
             min: _ctx.min,
             "model-value": modelValue.value,
             placeholder: _ctx.placeholder,
-            type: _ctx.type,
+            type: _ctx.type
+          }, _ctx.$attrs, {
+            precision: _ctx.precision,
             onBlur: handleBlur,
             onChange: handleInput,
             onFocus: _cache[0] || (_cache[0] = () => isBlur.value = false),
             onInput: handleInput,
             onKeydown: handleKeydown,
             onPaste: handlePaste
-          }, {
+          }), {
             suffix: withCtx(() => []),
             _: 1
             /* STABLE */
-          }, 8, ["disabled", "max", "min", "model-value", "placeholder", "type"]),
+          }, 16, ["disabled", "max", "min", "model-value", "placeholder", "type", "precision"]),
           unref(errorMessage) ? withDirectives((openBlock(), createBlock(
             unref(DbIcon),
             {
@@ -48075,7 +48295,7 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
           )), [
             [_directive_bk_tooltips, unref(errorMessage)]
           ]) : createCommentVNode("v-if", true),
-          _ctx.isShowBlur && isBlur.value ? (openBlock(), createElementBlock("div", _hoisted_1$5, [
+          _ctx.isShowBlur && isBlur.value ? (openBlock(), createElementBlock("div", _hoisted_1$4, [
             renderSlot(_ctx.$slots, "blur")
           ])) : createCommentVNode("v-if", true)
         ],
@@ -48085,7 +48305,7 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _sfc_main$5 = /* @__PURE__ */ defineComponent({
+const _sfc_main$4 = /* @__PURE__ */ defineComponent({
   __name: "fixed-column",
   props: {
     fixed: { default: "right" }
@@ -48113,202 +48333,22 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-function tryOnScopeDispose(fn2) {
-  if (getCurrentScope()) {
-    onScopeDispose(fn2);
-    return true;
-  }
-  return false;
-}
-function toValue(r2) {
-  return typeof r2 === "function" ? r2() : unref(r2);
-}
-const isClient = typeof window !== "undefined" && typeof document !== "undefined";
-typeof WorkerGlobalScope !== "undefined" && globalThis instanceof WorkerGlobalScope;
-function unrefElement(elRef) {
-  var _a;
-  const plain = toValue(elRef);
-  return (_a = plain == null ? void 0 : plain.$el) != null ? _a : plain;
-}
-const defaultWindow = isClient ? window : void 0;
-function useMounted() {
-  const isMounted = ref(false);
-  const instance2 = getCurrentInstance();
-  if (instance2) {
-    onMounted(() => {
-      isMounted.value = true;
-    }, instance2);
-  }
-  return isMounted;
-}
-function useSupported(callback) {
-  const isMounted = useMounted();
-  return computed(() => {
-    isMounted.value;
-    return Boolean(callback());
-  });
-}
-function useResizeObserver(target, callback, options = {}) {
-  const { window: window2 = defaultWindow, ...observerOptions } = options;
-  let observer;
-  const isSupported = useSupported(() => window2 && "ResizeObserver" in window2);
-  const cleanup = () => {
-    if (observer) {
-      observer.disconnect();
-      observer = void 0;
-    }
-  };
-  const targets = computed(() => Array.isArray(target) ? target.map((el) => unrefElement(el)) : [unrefElement(target)]);
-  const stopWatch = watch(
-    targets,
-    (els) => {
-      cleanup();
-      if (isSupported.value && window2) {
-        observer = new ResizeObserver(callback);
-        for (const _el of els)
-          _el && observer.observe(_el, observerOptions);
-      }
-    },
-    { immediate: true, flush: "post" }
-  );
-  const stop = () => {
-    cleanup();
-    stopWatch();
-  };
-  tryOnScopeDispose(stop);
-  return {
-    isSupported,
-    stop
-  };
-}
-const _hoisted_1$4 = ["data-fixed", "data-maxWidth", "data-minWidth", "data-width"];
-const _hoisted_2$2 = { class: "th-cell" };
-const _hoisted_3$1 = {
-  key: 0,
-  style: { "display": "inline-block", "line-height": "40px", "vertical-align": "top" }
-};
-const _sfc_main$4 = /* @__PURE__ */ defineComponent({
-  __name: "head-column",
-  props: {
-    width: { default: void 0 },
-    required: { type: Boolean, default: true },
-    minWidth: { default: void 0 },
-    maxWidth: { default: void 0 },
-    fixed: { default: void 0 }
-  },
-  setup(__props) {
-    const props2 = __props;
-    const { rowWidth, isOverflow: isMinimize } = inject(renderTablekey);
-    const parentTable = inject(tableColumnResizekey);
-    const slots = useSlots();
-    const columnRef = ref();
-    const currentWidth = ref(0);
-    const columnKey = random2();
-    let initWidthRate = 0;
-    let isDragedSelf = false;
-    const finalMinWidth = computed(() => props2.minWidth ? props2.minWidth : props2.width ?? 100);
-    const isFixedRight = computed(() => props2.fixed === "right");
-    const isFixedLeft = computed(() => props2.fixed === "left");
-    const styles = computed(() => {
-      if (props2.width && (rowWidth == null ? void 0 : rowWidth.value) && finalMinWidth.value) {
-        const newWidth = rowWidth.value * initWidthRate;
-        if (newWidth !== props2.width) {
-          let width = 0;
-          if (isMinimize == null ? void 0 : isMinimize.value) {
-            if (currentWidth.value !== 0 && (currentWidth.value !== finalMinWidth.value || currentWidth.value !== props2.width)) {
-              width = currentWidth.value;
-            } else {
-              width = finalMinWidth.value;
-            }
-          } else if (newWidth > finalMinWidth.value) {
-            width = newWidth;
-          } else {
-            width = finalMinWidth.value;
-          }
-          return {
-            minWidth: `${width}px`
-          };
-        }
-      }
-      return {
-        minWidth: props2.width ? `${props2.width}px` : "120px"
-      };
-    });
-    watch(() => [props2.width, rowWidth == null ? void 0 : rowWidth.value, currentWidth.value], ([width, rowWidth2, currentWidth2]) => {
-      if (!isDragedSelf) {
-        return;
-      }
-      if (width && rowWidth2 && currentWidth2 && finalMinWidth.value) {
-        isDragedSelf = false;
-        if (currentWidth2 !== 0 && (currentWidth2 !== finalMinWidth.value || currentWidth2 !== width)) {
-          initWidthRate = currentWidth2 / rowWidth2;
-        } else {
-          initWidthRate = (isMinimize == null ? void 0 : isMinimize.value) ? finalMinWidth.value / rowWidth2 : width / rowWidth2;
-        }
-      }
-    }, {
-      immediate: true
-    });
-    useResizeObserver(columnRef, () => {
-      if (!isDragedSelf) {
-        return;
-      }
-      const width = parseFloat(columnRef.value.style.width);
-      currentWidth.value = width;
-    });
-    const handleMouseDown = (event) => {
-      isDragedSelf = true;
-      parentTable == null ? void 0 : parentTable.columnMousedown(event, {
-        columnKey,
-        minWidth: finalMinWidth.value
-      });
-    };
-    const handleMouseMove = (event) => {
-      parentTable == null ? void 0 : parentTable.columnMouseMove(event);
-    };
-    return (_ctx, _cache) => {
-      const _directive_overflow_tips = resolveDirective("overflow-tips");
-      return openBlock(), createElementBlock("th", {
-        ref_key: "columnRef",
-        ref: columnRef,
-        class: normalizeClass(["bk-ediatable-head-column", {
-          "is-required": _ctx.required,
-          [`column-${unref(columnKey)}`]: true,
-          "is-right-fixed": unref(isMinimize) && isFixedRight.value,
-          "is-left-fixed": unref(isMinimize) && isFixedLeft.value
-        }]),
-        "data-fixed": _ctx.fixed,
-        "data-maxWidth": _ctx.maxWidth,
-        "data-minWidth": finalMinWidth.value,
-        "data-width": _ctx.width,
-        style: normalizeStyle(styles.value),
-        onMousedown: handleMouseDown,
-        onMousemove: handleMouseMove
-      }, [
-        withDirectives((openBlock(), createElementBlock("div", _hoisted_2$2, [
-          renderSlot(_ctx.$slots, "default")
-        ])), [
-          [_directive_overflow_tips]
-        ]),
-        unref(slots).append ? (openBlock(), createElementBlock("div", _hoisted_3$1, [
-          renderSlot(_ctx.$slots, "append")
-        ])) : createCommentVNode("v-if", true)
-      ], 46, _hoisted_1$4);
-    };
-  }
-});
 const _hoisted_1$3 = { class: "bk-ediatable-operation" };
 const _sfc_main$3 = /* @__PURE__ */ defineComponent({
-  __name: "operation",
+  __name: "operation-column",
   props: {
+    removeable: { type: Boolean, default: true },
+    showCopy: { type: Boolean, default: false },
     showAdd: { type: Boolean, default: true },
-    showRemove: { type: Boolean, default: true },
-    removeable: { type: Boolean, default: true }
+    showRemove: { type: Boolean, default: true }
   },
-  emits: ["add", "remove"],
+  emits: ["add", "copy", "remove"],
   setup(__props, { emit: __emit }) {
     const props2 = __props;
     const emits = __emit;
+    const handleCopy = () => {
+      emits("copy");
+    };
     const handleAppend = () => {
       emits("add");
     };
@@ -48319,12 +48359,19 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
       emits("remove");
     };
     return (_ctx, _cache) => {
-      return openBlock(), createBlock(_sfc_main$5, null, {
+      return openBlock(), createBlock(_sfc_main$4, null, {
         default: withCtx(() => [
           createElementVNode("div", _hoisted_1$3, [
-            _ctx.showAdd ? (openBlock(), createElementBlock("div", {
+            _ctx.showCopy ? (openBlock(), createElementBlock("div", {
               key: 0,
               class: "action-btn",
+              onClick: handleCopy
+            }, [
+              createVNode(unref(DbIcon), { type: "copy" })
+            ])) : createCommentVNode("v-if", true),
+            _ctx.showAdd ? (openBlock(), createElementBlock("div", {
+              key: 1,
+              class: "action-btn",
               onClick: handleAppend
             }, [
               createVNode(unref(DbIcon), { type: "plus-fill" })
@@ -48332,7 +48379,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
             _ctx.showRemove ? (openBlock(), createElementBlock(
               "div",
               {
-                key: 1,
+                key: 2,
                 class: normalizeClass(["action-btn", {
                   disabled: _ctx.removeable
                 }]),
@@ -48357,7 +48404,7 @@ const _hoisted_1$2 = {
   class: "select-error"
 };
 const _sfc_main$2 = /* @__PURE__ */ defineComponent({
-  __name: "select",
+  __name: "select-column",
   props: /* @__PURE__ */ mergeModels({
     list: {},
     placeholder: { default: "请选择" },
@@ -48436,7 +48483,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
           style: normalizeStyle({ height: rootHeight.value + "px" })
         },
         [
-          createVNode(unref(__webpack_exports__default$2), {
+          createVNode(unref(__webpack_exports__default$2), mergeProps(_ctx.$attrs, {
             "model-value": localValue.value,
             "auto-focus": "",
             class: "select-box",
@@ -48449,7 +48496,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
             "show-select-all": _ctx.showSelectAll,
             onChange: handleSelect,
             onClear: handleRemove
-          }, {
+          }), {
             default: withCtx(() => [
               (openBlock(true), createElementBlock(
                 Fragment,
@@ -48467,7 +48514,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
             ]),
             _: 1
             /* STABLE */
-          }, 8, ["model-value", "disabled", "multiple", "placeholder", "show-select-all"]),
+          }, 16, ["model-value", "disabled", "multiple", "placeholder", "show-select-all"]),
           unref(errorMessage) ? (openBlock(), createElementBlock("div", _hoisted_1$2, [
             withDirectives(createVNode(
               unref(DbIcon),
@@ -49658,7 +49705,7 @@ const _hoisted_2$1 = {
   style: { "display": "none" }
 };
 const _sfc_main$1 = /* @__PURE__ */ defineComponent({
-  __name: "tag-input",
+  __name: "tag-input-column",
   props: /* @__PURE__ */ mergeModels({
     placeholder: { default: "" },
     single: { type: Boolean, default: false },
@@ -49744,8 +49791,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
                 class: normalizeClass(["bk-ediatable-tag-input", { ["is-error"]: Boolean(unref(errorMessage)) }])
               },
               [
-                createVNode(unref(__webpack_exports__default$1), {
-                  "model-value": modelValue.value,
+                createVNode(unref(__webpack_exports__default$1), mergeProps({ "model-value": modelValue.value }, _ctx.$attrs, {
                   "allow-auto-match": "",
                   "allow-create": "",
                   clearable: false,
@@ -49757,7 +49803,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
                   onBlur: handleBlur,
                   onChange: handleChange,
                   onFocus: handleFocus
-                }, null, 8, ["model-value", "max-data", "placeholder"]),
+                }), null, 16, ["model-value", "max-data", "placeholder"]),
                 unref(errorMessage) ? (openBlock(), createElementBlock("div", _hoisted_1$1, [
                   withDirectives(createVNode(
                     unref(DbIcon),
@@ -49826,7 +49872,7 @@ const _hoisted_3 = {
   class: "input-error"
 };
 const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "text-plain",
+  __name: "text-plain-column",
   props: {
     data: {},
     isLoading: { type: Boolean },
@@ -49902,13 +49948,28 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 });
 const vue2 = {
   name: "Ediatable",
+  props: {
+    theadList: {
+      type: Array,
+      default: []
+    }
+  },
   created() {
-    this.app = createApp(_sfc_main$8);
+    this.app = createApp(_sfc_main$7, {
+      theadList: this.theadList
+    });
   },
   mounted() {
     this.app.mount(this.$el);
+    this.unWatchStack = Object.keys(this.$props).map((key) => {
+      return this.$watch(key, (value) => {
+        this.app._instance.props[key] = value;
+        this.app._instance.proxy.$forceUpdate();
+      });
+    });
   },
   beforeDestroy() {
+    this.unWatchStack.forEach((unWatch) => unWatch());
     this.app.unmount();
     this.app = null;
   },
@@ -49917,10 +49978,10 @@ const vue2 = {
   }
 };
 export {
-  _sfc_main$7 as DateTimePickerColumn,
-  _sfc_main$5 as FixedColumn,
-  _sfc_main$4 as HeadColumn,
-  _sfc_main$6 as InputColumn,
+  _sfc_main$6 as DateTimePickerColumn,
+  _sfc_main$4 as FixedColumn,
+  _sfc_main$8 as HeadColumn,
+  _sfc_main$5 as InputColumn,
   _sfc_main$3 as OperationColumn,
   _sfc_main$2 as SelectColumn,
   _sfc_main$1 as TagInputColumn,