模型ji基本信息展开

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

 import React, { useState, useEffect } from 'react';
-import { Form, Input, Row, Col, Descriptions, Select, AutoComplete, Checkbox } from 'antd';
+import { Form, Input, Row, Col, Descriptions, Select, AutoComplete, Checkbox, Button } from 'antd';
+import { DownOutlined, UpOutlined } from '@ant-design/icons';
 
 import { highlightSearchContentByTerms, generateUUID } from '../../../../util';
 import { dispatchLatest } from '../../../../model'; 
@@ -423,8 +424,8 @@ const ImportActionHeader = (props) => {
     }
   }
 
-  const onOnlyShowRequireChange = (e) => {
-    setOnlyShowRequireChange(e.target.checked);
+  const onOnlyShowRequireChange = () => {
+    setOnlyShowRequireChange(!onlyShowRequireChange);
   }
 
   let distributionDescription = '', primaryDescription = '', partitionsDescription = '', semiPrimaryDescription = '';
@@ -488,7 +489,9 @@ const ImportActionHeader = (props) => {
       }}
     >
       <h2>基本信息</h2>
-      <Checkbox onChange={onOnlyShowRequireChange} defaultChecked={onlyShowRequireChange} value={onlyShowRequireChange}>仅显示必填项</Checkbox>
+      {
+        onlyShowRequireChange ? <Button type='text' style={{ padding: 0, color: '#0069AC' }} onClick={onOnlyShowRequireChange}>展开<DownOutlined /></Button> : <Button type='text' style={{ padding: 0, color: '#0069AC' }} onClick={onOnlyShowRequireChange}>收起<UpOutlined /></Button>
+      }
     </div>
     {
       editable ? (

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

 .model-import-action-header {
-  .yy-form-item {
+  .yy-form-item:nth-last-col {
     margin-bottom: 24px;
   }
 

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

@@ -118,6 +118,7 @@ const ModelTable = (props) => {
     id: MENU_ID,
   });
   
+  const [ tableWidth, setTableWidth ] = useState(0);
   const [ selectedRowKeys, setSelectedRowKeys ] = useState([]);
   const [ subSelectedRowKeys, setSubSelectedRowKeys ] = useState([]);
   // const [ mouseEnterKey, setMouseEnterKey ] = useState(null);
@@ -620,31 +621,35 @@ const ModelTable = (props) => {
     <div className={classes}>
       <ResizeObserver
         onResize={({ width }) => {
-          let newColumns = [...cols];
-
-          if ((modelId||'') !== '') {
-
-            newColumns = cols.filter(item => item.dataIndex!=='key');
+          if (tableWidth !== width) {
+            setTableWidth(width);
             
-          } else if ((modelId||'')==='' && (view==='state'||(keyword||'')!=='')) {
-            newColumns = cols.splice(3, 0, pathColumn);
-          }
+            let newColumns = [...cols];
 
-          newColumns.forEach((column, index) => { 
+            if ((modelId||'') !== '') {
 
-            if (!column.width) {
-              const rowWidth = (columns.reduce((preVal, col) => (col.width?col.width:0) + preVal, 0)) + 50;
+              newColumns = cols.filter(item => item.dataIndex!=='key');
               
-              if (width > rowWidth) {
-                column.width = (width-rowWidth)>200?(width-rowWidth):200;        
-              } else {
-                column.width = 200;
-              }
+            } else if ((modelId||'')==='' && (view==='state'||(keyword||'')!=='')) {
+              newColumns = cols.splice(3, 0, pathColumn);
             }
 
-          });
+            newColumns.forEach((column, index) => { 
 
-          setColumns(newColumns);
+              if (!column.width) {
+                const rowWidth = (columns.reduce((preVal, col) => (col.width?col.width:0) + preVal, 0)) + 50;
+                
+                if (width > rowWidth) {
+                  column.width = (width-rowWidth)>200?(width-rowWidth):200;        
+                } else {
+                  column.width = 200;
+                }
+              }
+
+            });
+
+            setColumns(newColumns);
+          }
         }}
       >
         <Table

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

@@ -41,6 +41,7 @@ const ResizeableHeaderCell = props => {
 const SuggestTable = (props) => {
 
   const { suggests, onSelect } = props;
+  const [ tableWidth, setTableWidth ] = useState(0);
   
   const cols = [
     {
@@ -174,23 +175,26 @@ const SuggestTable = (props) => {
       <ResizeObserver
         onResize={({ width }) => {
 
-          let newColumns = [...cols];
+          if (tableWidth !== width) {
+            setTableWidth(width);
+            let newColumns = [...cols];
 
-          newColumns.forEach((column, index) => { 
+            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)>200?(width-rowWidth):200;        
-              } else {
-                column.width = 200;
+              if (!column.width) {
+                const rowWidth = (columns.reduce((preVal, col) => (col.width?col.width:0) + preVal, 0)) + 50;
+                
+                if (width > rowWidth) {
+                  column.width = (width-rowWidth)>200?(width-rowWidth):200;        
+                } else {
+                  column.width = 200;
+                }
               }
-            }
 
-          });
+            });
 
-          setColumns(newColumns);
+            setColumns(newColumns);
+          }
         }}
       >
         <Table