diff --git a/src/components/draggable-table/.keep b/src/components/draggable-table/.keep
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/src/components/draggable-table/index.vue b/src/components/draggable-table/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..304ea99db34591ad4f4fc4c1ea5e22d62b154f78
--- /dev/null
+++ b/src/components/draggable-table/index.vue
@@ -0,0 +1,44 @@
+<script>
+export default {
+  name: 'DraggabledTable',
+  render() {
+    const { $slots, $scopedSlots, $attrs, $props, $listeners } = this
+    const props = { ...$attrs, ...$props }
+    const resizeableTitle = {
+      header: {
+        cell(h, props, children) {
+          const { key, ...restProps } = props
+          const col = $attrs.columns.find((col) => {
+            const k = col.dataIndex || col.key
+            return k === key
+          })
+          if (!col?.width) {
+            return <th {...restProps}>{children}</th>
+          }
+          const onDrag = (x) => {
+            col.width = Math.max(x, 50)
+          }
+          return (
+            <th {...restProps} width={col.width} class='resize-table-th'>
+              {children}
+              <vue-draggable-resizable
+                style={{ transform: `translate(${col.width}px, 0px)` }}
+                key={col.key}
+                class='table-draggable-handle'
+                w={10}
+                x={col.width}
+                z={1}
+                axis='x'
+                draggable={true}
+                resizable={false}
+                onDragging={onDrag}
+              />
+            </th>
+          )
+        }
+      }
+    }
+
+  }
+}
+</script>