From 0a4c7fd8d93fe0d0e0fa5142ac4dfd3db635ed3a Mon Sep 17 00:00:00 2001
From: thinkgem <thinkgem@163.com>
Date: Fri, 15 Nov 2024 10:57:02 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=20Table=20=E5=8A=A8=E6=80=81?=
 =?UTF-8?q?=E7=9B=91=E6=B5=8B=E8=A1=A8=E6=A0=BC=E5=AE=BD=E5=BA=A6=EF=BC=8C?=
 =?UTF-8?q?=E6=98=AF=E5=90=A6=E6=98=BE=E7=A4=BA=E6=B0=B4=E5=B9=B3=E6=BB=9A?=
 =?UTF-8?q?=E5=8A=A8=E6=9D=A1=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Table/src/hooks/useTableScroll.ts | 13 +++++++++----
 src/views/sys/empUser/formEmployeeOfficeList.vue |  5 +++--
 2 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/src/components/Table/src/hooks/useTableScroll.ts b/src/components/Table/src/hooks/useTableScroll.ts
index 23fd9ad62..2bedafd97 100644
--- a/src/components/Table/src/hooks/useTableScroll.ts
+++ b/src/components/Table/src/hooks/useTableScroll.ts
@@ -6,7 +6,7 @@ import { isBoolean } from '/@/utils/is';
 import { useWindowSizeFn } from '/@/hooks/event/useWindowSizeFn';
 import { useModalContext } from '/@/components/Modal';
 import { onMountedOrActivated } from '/@/hooks/core/onMountedOrActivated';
-import { useDebounceFn } from '@vueuse/core';
+import { useDebounceFn, useResizeObserver } from '@vueuse/core';
 import { useScroll } from '/@/hooks/event/useScroll';
 
 export function useTableScroll(
@@ -203,6 +203,12 @@ export function useTableScroll(
     debounceRedoHeight();
   });
 
+  const tableWidthRef = ref();
+  useResizeObserver(wrapRef, () => {
+    const table = unref(tableElRef);
+    tableWidthRef.value = table?.$el?.offsetWidth || 600; // 默认宽度不小于，列中指定的宽度总合
+  });
+
   const getScrollRef: ComputedRef<any> = computed(() => {
     let width = 0;
     // if (unref(rowSelectionRef)) {
@@ -220,12 +226,11 @@ export function useTableScroll(
     //   width += unsetWidthColumnSize * 50;
     // }
 
-    const table = unref(tableElRef);
-    const tableWidth = table?.$el?.offsetWidth ?? 600; // 默认宽度不小于，列中指定的宽度总合
+    const tableWidth = tableWidthRef.value;
     const { canResize, scroll } = unref(propsRef);
     const canScrollX = tableWidth == 0 || width == 0 || tableWidth > width;
     return {
-      x: canScrollX ? (canResize ? width : undefined) : width,
+      x: canScrollX ? (canResize ? tableWidth : undefined) : tableWidth,
       y: canResize ? unref(tableHeightRef) : undefined,
       scrollToFirstRowOnChange: true,
       ...scroll,
diff --git a/src/views/sys/empUser/formEmployeeOfficeList.vue b/src/views/sys/empUser/formEmployeeOfficeList.vue
index acfb8eb4e..e9543769f 100644
--- a/src/views/sys/empUser/formEmployeeOfficeList.vue
+++ b/src/views/sys/empUser/formEmployeeOfficeList.vue
@@ -14,9 +14,8 @@
 <script lang="ts" setup>
   import { useI18n } from '/@/hooks/web/useI18n';
   import { Icon } from '/@/components/Icon';
-  import { BasicTable, BasicColumn, useTable } from '/@/components/Table';
+  import { BasicTable, useTable } from '/@/components/Table';
   import { officeTreeData } from '/@/api/sys/office';
-  import { areaTreeData } from '/@/api/sys/area';
   import { Ref } from 'vue';
 
   const { t } = useI18n('sys.empUser');
@@ -91,6 +90,7 @@
         title: t('附属机构'),
         dataIndex: 'officeCode',
         dataLabel: 'officeName',
+        width: 130,
         align: 'left',
         editRow: true,
         editComponent: 'TreeSelect',
@@ -105,6 +105,7 @@
         title: t('附属岗位'),
         dataIndex: 'postCode',
         dataLabel: 'postName',
+        width: 130,
         align: 'left',
         editRow: true,
         editComponent: 'Select',