refactor: table columns width adjustment

erda-project · Jul 23, 2021 · 5250c67 · 5250c67
1 parent 3a66a74
commit 5250c67
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 5 deletions.
diff --git a/core/src/nusi/wrapped-table.tsx b/core/src/nusi/wrapped-table.tsx
@@ -18,8 +18,8 @@ import { ColumnProps as AntdColumnProps, TableProps } from 'antd/lib/table';
 export interface ColumnProps<recordType> extends AntdColumnProps<recordType> {
   /**
    * id\number - 72
-   * user\status\type\cpu\memory\ip\host - 120
-   * email\phone\roles - 160
+   * user\status\type\cpu\memory - 120
+   * email\phone\roles\ip - 160
    * time - 200
    * operations - 80 * n, according to the number of buttons and the number of words
    * detail\content\description - No need to increase the width of the adaptive, and add the scroll.x of a certain number to the table

diff --git a/shell/app/modules/cmp/common/addon-detail/resource.tsx b/shell/app/modules/cmp/common/addon-detail/resource.tsx
@@ -34,45 +34,49 @@ export const PureResourceList = ({ renderOp, resourceList, loading, drawerComp }
       title: i18n.t('container IP'),
       dataIndex: 'containerIP',
       key: 'containerIP',
-      width: 150,
+      width: 160,
       fixed: 'left',
     },
     {
       title: i18n.t('host IP'),
       dataIndex: 'hostIP',
       key: 'hostIP',
+      width: 160,
     },
     {
       title: i18n.t('cpu limit'),
       dataIndex: 'cpuLimit',
       key: 'cpuLimit',
+      width: 120,
       sorter: (a: IResource, b: IResource) => a.cpuLimit - b.cpuLimit,
     },
     {
       title: i18n.t('org:CPU allocation'),
       dataIndex: 'cpuRequest',
       key: 'cpuRequest',
+      width: 120,
       sorter: (a: IResource, b: IResource) => a.cpuRequest - b.cpuRequest,
     },
     {
       title: i18n.t('memory limit'),
       dataIndex: 'memLimit',
       key: 'memLimit',
+      width: 120,
       render: (v: number) => getFormatter('CAPACITY', 'MB').format(v),
       sorter: (a: IResource, b: IResource) => a.memLimit - b.memLimit,
     },
     {
       title: i18n.t('org:MEM allocation'),
       dataIndex: 'memRequest',
       key: 'memRequest',
+      width: 120,
       render: (v: number) => getFormatter('CAPACITY', 'MB').format(v),
       sorter: (a: IResource, b: IResource) => a.memRequest - b.memRequest,
     },
     {
       title: i18n.t('image'),
       dataIndex: 'image',
       key: 'image',
-      width: 300,
       render: (image: string) => (
         <Tooltip title={image}>
           <Copy className="for-copy" data-clipboard-tip={i18n.t('image')} data-clipboard-text={image}>
@@ -114,7 +118,7 @@ export const PureResourceList = ({ renderOp, resourceList, loading, drawerComp }
     {
       title: i18n.t('operations'),
       key: 'operation',
-      width: 120,
+      width: 176,
       fixed: 'right',
       render: renderOp,
     },