From ea36e260e201e0947cba1059115e0b016ad2c11b Mon Sep 17 00:00:00 2001
From: xiaoxian521 <1923740402@qq.com>
Date: Mon, 15 Apr 2024 12:52:01 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E5=BD=93=E4=B8=80?=
 =?UTF-8?q?=E4=B8=AA=E9=A1=B5=E9=9D=A2=E5=AD=98=E5=9C=A8=E5=A4=9A=E4=B8=AA?=
 =?UTF-8?q?`RePureTableBar`=E7=BB=84=E4=BB=B6=EF=BC=8C=E5=88=97=E6=97=A0?=
 =?UTF-8?q?=E6=B3=95=E6=AD=A3=E5=B8=B8=E6=8B=96=E5=8A=A8=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/RePureTableBar/src/bar.tsx | 22 ++++++++++++++++++----
 1 file changed, 18 insertions(+), 4 deletions(-)

diff --git a/src/components/RePureTableBar/src/bar.tsx b/src/components/RePureTableBar/src/bar.tsx
index b2a755567..615785249 100644
--- a/src/components/RePureTableBar/src/bar.tsx
+++ b/src/components/RePureTableBar/src/bar.tsx
@@ -1,7 +1,15 @@
 import Sortable from "sortablejs";
 import { transformI18n } from "@/plugins/i18n";
 import { useEpThemeStoreHook } from "@/store/modules/epTheme";
-import { defineComponent, ref, computed, type PropType, nextTick } from "vue";
+import {
+  type PropType,
+  ref,
+  unref,
+  computed,
+  nextTick,
+  defineComponent,
+  getCurrentInstance
+} from "vue";
 import {
   delay,
   cloneDeep,
@@ -34,6 +42,10 @@ const props = {
   isExpandAll: {
     type: Boolean,
     default: true
+  },
+  tableKey: {
+    type: [String, Number] as PropType<string | number>,
+    default: "0"
   }
 };
 
@@ -46,6 +58,7 @@ export default defineComponent({
     const loading = ref(false);
     const checkAll = ref(true);
     const isIndeterminate = ref(false);
+    const instance = getCurrentInstance()!;
     const isExpandAll = ref(props.isExpandAll);
     const filterColumns = cloneDeep(props?.columns).filter(column =>
       isBoolean(column?.hide)
@@ -170,9 +183,9 @@ export default defineComponent({
     const rowDrop = (event: { preventDefault: () => void }) => {
       event.preventDefault();
       nextTick(() => {
-        const wrapper: HTMLElement = document.querySelector(
-          ".el-checkbox-group>div"
-        );
+        const wrapper: HTMLElement = (
+          instance?.proxy?.$refs[`GroupRef${unref(props.tableKey)}`] as any
+        ).$el.firstElementChild;
         Sortable.create(wrapper, {
           animation: 300,
           handle: ".drag-btn",
@@ -299,6 +312,7 @@ export default defineComponent({
                 <div class="pt-[6px] pl-[11px]">
                   <el-scrollbar max-height="36vh">
                     <el-checkbox-group
+                      ref={`GroupRef${unref(props.tableKey)}`}
                       modelValue={checkedColumns.value}
                       onChange={value => handleCheckedColumnsChange(value)}
                     >