refactor: 所有表格操作列宽度调整为'auto', 这样会根据子元素宽度适配(比如没有分配权限的情况)

9 months ago · a47910f650
parent 4ead56eaf1
commit a47910f650
24 changed files with 57 additions and 25 deletions
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@ -1,3 +1,9 @@
+# 1.3.2
+
+**REFACTOR**
+
+- 所有表格操作列宽度调整为'auto', 这样会根据子元素宽度适配(比如没有分配权限的情况)
+
 # 1.3.1

 **REFACTOR**
--- a/apps/web-antd/src/views/demo/demo/data.ts
+++ b/apps/web-antd/src/views/demo/demo/data.ts
@ -51,7 +51,8 @@ export const columns: VxeGridProps['columns'] = [
    fixed: 'right',
    slots: { default: 'action' },
    title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
  },
 ];

--- a/apps/web-antd/src/views/demo/tree/data.ts
+++ b/apps/web-antd/src/views/demo/tree/data.ts
@ -60,7 +60,8 @@ export const columns: VxeGridProps['columns'] = [
    fixed: 'right',
    slots: { default: 'action' },
    title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
  },
 ];

--- a/apps/web-antd/src/views/monitor/online/data.ts
+++ b/apps/web-antd/src/views/monitor/online/data.ts
@ -79,6 +79,7 @@ export const columns: VxeGridProps['columns'] = [
    fixed: 'right',
    slots: { default: 'action' },
    title: '操作',
-    width: 120,
+    resizable: false,
+    width: 'auto',
  },
 ];
--- a/apps/web-antd/src/views/monitor/operlog/data.tsx
+++ b/apps/web-antd/src/views/monitor/operlog/data.tsx
@ -86,6 +86,7 @@ export const columns: VxeGridProps['columns'] = [
    fixed: 'right',
    slots: { default: 'action' },
    title: '操作',
-    width: 120,
+    resizable: false,
+    width: 'auto',
  },
 ];
--- a/apps/web-antd/src/views/system/client/data.tsx
+++ b/apps/web-antd/src/views/system/client/data.tsx
@ -95,7 +95,8 @@ export const columns: VxeGridProps['columns'] = [
    fixed: 'right',
    slots: { default: 'action' },
    title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
  },
 ];

--- a/apps/web-antd/src/views/system/config/data.ts
+++ b/apps/web-antd/src/views/system/config/data.ts
@ -71,7 +71,8 @@ export const columns: VxeGridProps['columns'] = [
    fixed: 'right',
    slots: { default: 'action' },
    title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
  },
 ];

--- a/apps/web-antd/src/views/system/dept/data.ts
+++ b/apps/web-antd/src/views/system/dept/data.ts
@ -39,11 +39,13 @@ export const columns: VxeGridProps['columns'] = [
  {
    field: 'orderNum',
    title: '排序',
-    width: 180,
+    resizable: false,
+    width: 'auto',
  },
  {
    field: 'status',
-    width: 180,
+    resizable: false,
+    width: 'auto',
    title: '状态',
    slots: {
      default: ({ row }) => {
--- a/apps/web-antd/src/views/system/dict/data/data.ts
+++ b/apps/web-antd/src/views/system/dict/data/data.ts
@ -45,7 +45,8 @@ export const columns: VxeGridProps['columns'] = [
    fixed: 'right',
    slots: { default: 'action' },
    title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
  },
 ];

--- a/apps/web-antd/src/views/system/dict/type/data.ts
+++ b/apps/web-antd/src/views/system/dict/type/data.ts
@ -39,7 +39,8 @@ export const columns: VxeGridProps['columns'] = [
    fixed: 'right',
    slots: { default: 'action' },
    title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
  },
 ];

--- a/apps/web-antd/src/views/system/menu/data.tsx
+++ b/apps/web-antd/src/views/system/menu/data.tsx
@ -145,7 +145,8 @@ export const columns: VxeGridProps['columns'] = [
    fixed: 'right',
    slots: { default: 'action' },
    title: '操作',
-    width: 200,
+    resizable: false,
+    width: 'auto',
  },
 ];

--- a/apps/web-antd/src/views/system/notice/data.ts
+++ b/apps/web-antd/src/views/system/notice/data.ts
@ -69,7 +69,8 @@ export const columns: VxeGridProps['columns'] = [
    fixed: 'right',
    slots: { default: 'action' },
    title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
  },
 ];

--- a/apps/web-antd/src/views/system/oss-config/data.tsx
+++ b/apps/web-antd/src/views/system/oss-config/data.tsx
@ -81,7 +81,8 @@ export const columns: VxeGridProps['columns'] = [
    fixed: 'right',
    slots: { default: 'action' },
    title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
  },
 ];

--- a/apps/web-antd/src/views/system/oss/data.tsx
+++ b/apps/web-antd/src/views/system/oss/data.tsx
@ -69,7 +69,8 @@ export const columns: VxeGridProps['columns'] = [
    fixed: 'right',
    slots: { default: 'action' },
    title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
  },
 ];

--- a/apps/web-antd/src/views/system/post/data.ts
+++ b/apps/web-antd/src/views/system/post/data.ts
@ -65,7 +65,8 @@ export const columns: VxeGridProps['columns'] = [
    fixed: 'right',
    slots: { default: 'action' },
    title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
  },
 ];

--- a/apps/web-antd/src/views/system/role-assign/data.tsx
+++ b/apps/web-antd/src/views/system/role-assign/data.tsx
@ -37,6 +37,7 @@ export const columns: VxeGridProps['columns'] = [
    fixed: 'right',
    slots: { default: 'action' },
    title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
  },
 ];
--- a/apps/web-antd/src/views/system/tenant/data.tsx
+++ b/apps/web-antd/src/views/system/tenant/data.tsx
@ -68,7 +68,8 @@ export const columns: VxeGridProps['columns'] = [
    fixed: 'right',
    slots: { default: 'action' },
    title: '操作',
-    width: 200,
+    resizable: false,
+    width: 'auto',
  },
 ];

--- a/apps/web-antd/src/views/system/tenantPackage/data.ts
+++ b/apps/web-antd/src/views/system/tenantPackage/data.ts
@ -29,7 +29,8 @@ export const columns: VxeGridProps['columns'] = [
    fixed: 'right',
    slots: { default: 'action' },
    title: '操作',
-    width: 180,
+    resizable: false,
+    width: 'auto',
  },
 ];

--- a/apps/web-antd/src/views/workflow/category/data.ts
+++ b/apps/web-antd/src/views/workflow/category/data.ts
@ -33,7 +33,8 @@ export const columns: VxeGridProps['columns'] = [
    fixed: 'right',
    slots: { default: 'action' },
    title: '操作',
-    width: 200,
+    resizable: false,
+    width: 'auto',
  },
 ];

--- a/apps/web-antd/src/views/workflow/leave/data.tsx
+++ b/apps/web-antd/src/views/workflow/leave/data.tsx
@ -91,7 +91,8 @@ export const columns: VxeGridProps['columns'] = [
    fixed: 'right',
    slots: { default: 'action' },
    title: '操作',
-    width: 210,
+    resizable: false,
+    width: 'auto',
  },
 ];

--- a/apps/web-antd/src/views/workflow/processDefinition/category-tree.vue
+++ b/apps/web-antd/src/views/workflow/processDefinition/category-tree.vue
@ -1,7 +1,9 @@
 <script setup lang="ts">
+import type { PropType } from 'vue';
+
 import type { CategoryTree } from '#/api/workflow/category/model';

-import { onMounted, type PropType, ref } from 'vue';
+import { onMounted, ref } from 'vue';

 import { SyncOutlined } from '@ant-design/icons-vue';
 import { InputSearch, Skeleton, Tree } from 'ant-design-vue';
--- a/apps/web-antd/src/views/workflow/processDefinition/data.tsx
+++ b/apps/web-antd/src/views/workflow/processDefinition/data.tsx
@ -63,7 +63,7 @@ export const columns: VxeGridProps['columns'] = [
    slots: { default: 'action' },
    title: '操作',
    resizable: false,
-    width: 200,
+    width: 'auto',
  },
 ];

--- a/apps/web-antd/src/views/演示使用自行删除/sse/index.vue
+++ b/apps/web-antd/src/views/演示使用自行删除/sse/index.vue
@ -1,9 +1,11 @@
 <script setup lang="ts">
+import type { VxeGridProps } from '#/adapter/vxe-table';
+
 import { Page, useVbenModal } from '@vben/common-ui';

 import { Space } from 'ant-design-vue';

-import { useVbenVxeGrid, type VxeGridProps } from '#/adapter/vxe-table';
+import { useVbenVxeGrid } from '#/adapter/vxe-table';

 import { sseList } from './api';
 import sendMsgModal from './send-msg-modal.vue';
@ -31,7 +33,8 @@ const gridOptions: VxeGridProps = {
      fixed: 'right',
      slots: { default: 'action' },
      title: '操作',
-      width: 180,
+      resizable: false,
+      width: 'auto',
    },
  ],
  height: 'auto',
--- a/playground/src/views/system/dept/data.ts
+++ b/playground/src/views/system/dept/data.ts
@ -94,8 +94,9 @@ export function useColumns(
    },
    {
      field: 'createTime',
+      resizable: false,
      title: $t('system.dept.createTime'),
-      width: 180,
+      width: 'auto',
    },
    {
      field: 'remark',