调整样式

src/view/Manage/Model/Component/ImportActionTable.jsx

@@ -1213,15 +1213,13 @@ const ImportActionTable = (props) => {
                     editingKey!=='' && <React.Fragment>
                     {
                       suggests && suggests.length>0 && (
-                        <React.Fragment>
-                          <SuggestTable suggests={suggests} onSelect={onSuggestChange} />
-                        </React.Fragment>
+                        <SuggestTable suggests={suggests} onSelect={onSuggestChange} />
                       )
                     }
                     </React.Fragment>
                   }
                   {
-                    suggestHaveMore && <div className='flex mt-3' style={{ justifyContent: 'center' }}>
+                    suggestHaveMore && <div className='flex pt-3' style={{ justifyContent: 'center' }}>
                       <Button onClick={loadMoreSuggests}>加载更多</Button>
                     </div> 
                   }

src/view/Manage/Model/Component/SuggestTable.jsx

 import React, { useState } from 'react';
 import { Table, Tooltip } from 'antd';
 import { Resizable } from 'react-resizable';
+import ResizeObserver from 'rc-resize-observer';
 
 import { isSzseEnv } from '../../../../util';
 import { dispatch } from '../../../../model'; 
 
+import './SuggestTable.less';
+
 const ResizeableHeaderCell = props => {
   const { onResize, width, onClick, ...restProps } = props;
 
@@ -38,7 +41,7 @@ const ResizeableHeaderCell = props => {
 const SuggestTable = (props) => {
 
   const { suggests, onSelect } = props;
-
+  
   const cols = [
     {
       title: '中文名称',
@@ -96,6 +99,7 @@ const SuggestTable = (props) => {
       title: '使用次数',
       dataIndex: 'referencesCount',
       width: 80,
+      ellipsis: true,
       render: (_, record) => {
         return (
           <span>{record.recommendedStats?.referencesCount}</span>
@@ -166,38 +170,64 @@ const SuggestTable = (props) => {
   };
 
   return (
-    <Table
-      rowSelection={rowSelection}
-      dataSource={suggests||[]}
-      pagination={false}
-      rowClassName={(record, index) => {
-        return 'pointer';
-      }}
-      components={{
-        header: {
-          cell: ResizeableHeaderCell,
-        }
-      }}
-      columns={
-        columns.map((col, index) => ({
-          ...col,
-          onHeaderCell: column => ({
-            width: column.width,
-            onResize: handleResize(index),
-          }),
-        }))
-      }
-      onRow={(record, index) => {
-        return {
-          onClick: (e) => {
-            onSelect && onSelect(record);
+    <div className='suggest-table'>
+      <ResizeObserver
+        onResize={({ width }) => {
+
+          let newColumns = [...cols];
+
+          newColumns.forEach((column, index) => { 
+
+            if (!column.width) {
+              const rowWidth = (columns.reduce((preVal, col) => (col.width?col.width:0) + preVal, 0)) + 50;
+              
+              if (width > rowWidth) {
+                column.width = width - rowWidth;
+        
+              } else {
+                column.width = 200;
+              }
+            }
+
+          });
+
+          setColumns(newColumns);
+        }}
+      >
+        <Table
+          rowSelection={rowSelection}
+          dataSource={suggests||[]}
+          pagination={false}
+          loading={false}
+          rowClassName={(record, index) => {
+            return 'pointer';
+          }}
+          components={{
+            header: {
+              cell: ResizeableHeaderCell,
+            }
+          }}
+          columns={
+            columns.map((column, index) => { 
+              return {
+                ...column,
+                onHeaderCell: (column: { width: any; }) => ({
+                  width: column.width,
+                  onResize: handleResize(index),
+                }),
+              };
+            })
           }
-        }
-      }}
-      scroll={{
-        x: 'max-content'
-      }}
-    />
+          onRow={(record, index) => {
+            return {
+              onClick: (e) => {
+                onSelect && onSelect(record);
+              }
+            }
+          }}
+        />
+      </ResizeObserver>
+    </div>
   );
 }
 

src/view/Manage/Model/Component/SuggestTable.less

+.suggest-table {
+  .yy-table {
+    margin: 0 !important;
+  }
+}
\ No newline at end of file