维护历史

src/model/datamodel.js

@@ -281,3 +281,7 @@ export function* isSetRootDomainId() {
 export function* setRootDomainId(payload) {
   return yield call(datamodelerService.setRootDomainId, payload);
 } 
+
+export function* getMaintenanceRecords(payload) {
+  return yield call(datamodelerService.getMaintenanceRecords, payload);
+}
\ No newline at end of file

src/service/datamodeler.js

@@ -173,6 +173,10 @@ export function setRootDomainId(payload) {
   return PostJSON("/datamodeler/easyDataModelerCURD/setRootDomainId", payload);
 }
 
+export function getMaintenanceRecords(payload) {
+  return PostJSON("/datamodeler/easyDataModelerCURD/getMaintenanceRecords", payload);
+}
+
 export function ddlGenerators() {
   return GetJSON("/datamodeler/easyDataModelerExport/ddlGenerators");
 }

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

@@ -3,7 +3,7 @@ import { Form, Input, Row, Col, Descriptions, Select, AutoComplete, Button } fro
 import { DownOutlined, UpOutlined } from '@ant-design/icons';
 
 import { highlightSearchContentByTerms, generateUUID } from '../../../../util';
-import { dispatchLatest } from '../../../../model'; 
+import { dispatch, dispatchLatest } from '../../../../model'; 
 
 import DebounceInput from './DebounceInput';
 
@@ -312,6 +312,7 @@ const ImportActionHeader = (props) => {
 
   const [ autoTranslate, setAutoTranslate ] = useState(false);
   const [ onlyShowRequireChange, setOnlyShowRequireChange ] = useState(true);
+  const [ maintenanceRecords, setMaintenanceRecords ] = useState(null);
 
   useEffect(() => {
 
@@ -339,6 +340,10 @@ const ImportActionHeader = (props) => {
     setAutoTranslate((modelerData.name||'')==='');
     if (modelerData) {
       form?.setFieldsValue(modelerData);
+
+      if ((modelerData.id||'')!=='' && maintenanceRecords===null) {
+        getMaintenanceRecords();
+      }
     }
     
     //eslint-disable-next-line react-hooks/exhaustive-deps
@@ -355,6 +360,20 @@ const ImportActionHeader = (props) => {
     },
   };
 
+  const getMaintenanceRecords = () => {
+    dispatch({
+      type: 'datamodel.getMaintenanceRecords',
+      payload: {
+        params: {
+          id: modelerData.id
+        }
+      },
+      callback: data => {
+        setMaintenanceRecords(data);
+      }
+    })
+  }
+
   const onSearch = (searchText) => {
 
     const _searchText = searchText.replace(/ /g,'');
@@ -427,7 +446,7 @@ const ImportActionHeader = (props) => {
     setOnlyShowRequireChange(!onlyShowRequireChange);
   }
 
-  let distributionDescription = '', primaryDescription = '', partitionsDescription = '', semiPrimaryDescription = '';
+  let distributionDescription = '', primaryDescription = '', partitionsDescription = '', semiPrimaryDescription = '', maintenanceDescription = '';
 
   if (!editable && modelerData) {
     //分布
@@ -479,6 +498,18 @@ const ImportActionHeader = (props) => {
     }
   }
 
+  if ((maintenanceRecords||[]).length>0) {
+    maintenanceRecords.forEach((record, index) => {
+      if (index !== 0) {
+        maintenanceDescription += '/';
+      }
+      
+      maintenanceDescription += record;
+    })
+
+    form.setFieldsValue({ maintenanceRecords: maintenanceDescription });
+  }
+
   return (
     <div className='model-import-action-header'>
     <div 
@@ -692,7 +723,15 @@ const ImportActionHeader = (props) => {
               <Descriptions.Item label="类主键">{highlightSearchContentByTerms(semiPrimaryDescription||'', terms)}</Descriptions.Item>
               <Descriptions.Item label="加载方式">{highlightSearchContentByTerms(modelerData.dataLoadingStrategy||'', terms)}</Descriptions.Item>
               <Descriptions.Item label="更新时间">{highlightSearchContentByTerms(modelerData.dataUpdatingTiming||'', terms)}</Descriptions.Item>
-              <Descriptions.Item label="维护历史">{highlightSearchContentByTerms(modelerData.maintenanceRecords||'', terms)}</Descriptions.Item> 
+              <Descriptions.Item label="维护历史">
+                <div>
+                {
+                  (maintenanceRecords||[]).map((record, index) => {
+                    return <div key={index}>{record||''}</div>;
+                  })
+                }
+                </div>
+              </Descriptions.Item> 
             </React.Fragment>
           }         
         </Descriptions>

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

@@ -889,6 +889,9 @@ const ImportActionIndex = (props) => {
               rowClassName="editable-row"
               pagination={false}
               sticky
+              scroll={{
+                x: 1200
+              }}
             />
           </Form>
         </DndProvider>

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

 import React, { useState, useCallback, useRef, useEffect } from 'react';
 import { Input, Form, Typography, Button, Select, Row, Col, Popover, Checkbox, Tooltip, Table, Pagination, Space } from 'antd';
-import { CloseOutlined, CheckOutlined, PlusOutlined, MinusOutlined, QuestionCircleOutlined } from '@ant-design/icons';
+import { CloseOutlined, CheckOutlined, PlusOutlined, QuestionCircleOutlined, DeleteOutlined } from '@ant-design/icons';
 import { DndProvider, useDrag, useDrop } from 'react-dnd';
 import { HTML5Backend } from 'react-dnd-html5-backend';
 import update from 'immutability-helper';
 import { useClickAway } from 'ahooks';
 import { useContextMenu, Menu as RcMenu, Item as RcItem } from "react-contexify";
+import ResizeObserver from 'rc-resize-observer';
 
 import { generateUUID, highlightSearchContentByTerms, showMessage, inputWidth, paginate } from '../../../../util';
 import { dispatchLatest } from '../../../../model'; 
@@ -255,6 +256,7 @@ const ImportActionTable = (props) => {
   const [ englishSuggests, setEnglishSuggests ] = useState([]);
   const [ keywordCondition, setKeywordCondition ] = useState({ keyword: '', needFilter: true });
   const { keyword, needFilter } = keywordCondition;
+  const [ tableWidth, setTableWidth ] = useState(0);
 
   const [ autoTranslate, setAutoTranslate ] = useState(false);
 
@@ -412,21 +414,8 @@ const ImportActionTable = (props) => {
   }
 
   const editLogic = (record) => {
-    form.setFieldsValue({
-      name: '',
-      cnName: '',
-      datatype: null,
-      nullable: null,
-      partOfPrimaryKeyLogically: null,
-      partOfDistributionKey: null,
-      needAttention: null,
-      remark: '',
-      defaultValue: '',
-      definition: '',
-      foreignKey: null,
-      valueRange: '',
-      ...record,
-    });
+    form.resetFields();
+    form.setFieldsValue(record);
 
     setEditingKey(record?.iid);
     setAutoTranslate((record?.name||'')==='');
@@ -951,7 +940,7 @@ const ImportActionTable = (props) => {
                     className='mr-3' 
                     size='small'
                     type='text' 
-                    icon={<MinusOutlined />} 
+                    icon={<DeleteOutlined style={{ color: 'red' }} />} 
                     onClick={(event) => { 
                       event.stopPropagation();
                       remove(record); 
@@ -1162,6 +1151,11 @@ const ImportActionTable = (props) => {
         </Space>
       </div>
       <div className='mb-3' id="containerId" ref={tableRef}>
+        <ResizeObserver
+          onResize={({ width }) => {
+            setTableWidth(width);
+          }}
+        >
           <DndProvider backend={HTML5Backend} >
             <Form form={form} component={false} onValuesChange={onValuesChange}>
               <Table
@@ -1219,7 +1213,9 @@ const ImportActionTable = (props) => {
                 pagination={false}
                 sticky
                 scroll={{
-                x: 1500
+                  x: 1500,
+                  //解决屏幕尺寸窄时,字段不好横向拖动的问题
+                  y: tableWidth>1500?'100%':450,
                 }}
                 expandable={{
                   columnWidth: 0,
@@ -1252,6 +1248,7 @@ const ImportActionTable = (props) => {
               />
             </Form>
           </DndProvider>
+        </ResizeObserver>
         {
           (filterData.length > supportMaxAttributeCountPerPage) && <Pagination
             className="text-center mt-3"