模型保存有字段正在编辑给提示

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

+import React from 'react';
+
+export const EditModelContext = React.createContext();
\ No newline at end of file

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

@@ -9,6 +9,7 @@ import { dispatchLatest } from '../../../../model';
 import { getQueryParam, showMessage, showNotifaction } from '../../../../util';
 import { Action, CatalogId, ModelerId, Hints, ModelerData, PermitCheckOut, Editable, StateId, VersionId, Holder, DDL, ReadOnly } from '../../../../util/constant';
 import HistoryAndVersionDrawer from './HistoryAndVersionDrawer';
+import { EditModelContext } from './ContextManage';
 
 import './EditModel.less';
 
@@ -24,6 +25,8 @@ const EditModel = (props) => {
   const [ autoTabKey, setAutoTabKey ] = useState(null);
 
   const actionRef = useRef('');
+  const attrIsEditingRef = useRef(false);
+  const indexIsEditingRef = useRef(false);
 
   const { action, catalogId, modelerId, hints, roughModelerData, permitCheckOut, editable, stateId, versionId, holder, ddl, readOnly } = actionData;
 
@@ -116,7 +119,19 @@ const EditModel = (props) => {
     }
   }
 
-  const save = async (e, cid = '') => {
+  const save = (e) => {
+    e.stopPropagation();
+
+    if (attrIsEditingRef.current) {
+      showMessage("warn", '还有字段正在编辑，需先保存该字段!');
+    } else if (indexIsEditingRef.current) {
+      showMessage("warn", '还有索引正在编辑，需先保存该索引!');
+    } else {
+      saveLogic();
+    }
+  }
+
+  const saveLogic = async (e, cid = '') => {
 
     setAutoTabKey(null);
 
@@ -225,7 +240,7 @@ const EditModel = (props) => {
     setCatalogModalVisible(false);
 
     if ((id||'') !== '') {
-      save(null, id);
+      saveLogic(null, id);
     }
   }
 
@@ -237,6 +252,14 @@ const EditModel = (props) => {
     setHistoryAndVersionDrawerVisible(false);
   }
 
+  const attrIsEditingFunction = (value) => {
+    attrIsEditingRef.current = value;
+  }
+
+  const indexIsEditingFunction = (value) => {
+    indexIsEditingRef.current = value;
+  }
+
   let title = '';
   if (action === 'add') {
     title = '新增模型';
@@ -323,28 +346,33 @@ const EditModel = (props) => {
   }
 
   return (
-    <div className='edit-model position-relative'>
-      <div className='edit-header'>
-        <span style={{ fontSize: 16, fontWeight: 'bold', color: '#fff' }}>{title}</span>
-      </div>
-      <div className='edit-container'>
-        <div className='edit-container-card'>
-          <ImportAction hints={hints} onChange={onActionChange} action={action} modelerId={modelerId} ddl={ddl} form={form} terms={terms} roughModelerData={roughModelerData} permitCheckOut={permitCheckOut} stateId={stateId} versionId={versionId} autoTabKey={autoTabKey} {...props} /> 
+    <EditModelContext.Provider value={{
+      attrIsEditingFunction,
+      indexIsEditingFunction,
+    }}>
+      <div className='edit-model position-relative'>
+        <div className='edit-header'>
+          <span style={{ fontSize: 16, fontWeight: 'bold', color: '#fff' }}>{title}</span>
         </div>
+        <div className='edit-container'>
+          <div className='edit-container-card'>
+            <ImportAction hints={hints} onChange={onActionChange} action={action} modelerId={modelerId} ddl={ddl} form={form} terms={terms} roughModelerData={roughModelerData} permitCheckOut={permitCheckOut} stateId={stateId} versionId={versionId} autoTabKey={autoTabKey} {...props} /> 
+          </div>
+        </div>
+        <div className='edit-footer'>
+        {actionsBtn}  
+        </div>
+        <CatalogModal
+          visible={catalogModalVisible}
+          onCancel={onCatalogModalCancel}
+        />
+        <HistoryAndVersionDrawer
+          id={modelerId}
+          visible={historyAndVersionDrawerVisible}
+          onCancel={onHistoryAndVersionDrawerCancel}
+        />
       </div>
-      <div className='edit-footer'>
-      {actionsBtn}  
-      </div>
-      <CatalogModal
-        visible={catalogModalVisible}
-        onCancel={onCatalogModalCancel}
-      />
-      <HistoryAndVersionDrawer
-        id={modelerId}
-        visible={historyAndVersionDrawerVisible}
-        onCancel={onHistoryAndVersionDrawerCancel}
-      />
-    </div>
+    </EditModelContext.Provider>
   );
 } 
 

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

-import React, { useState, useCallback, useRef, useEffect } from 'react';
+import React, { useState, useCallback, useRef, useEffect, useContext } from 'react';
 import { Input, Form, Typography, Button, Select, Row, Col, Popover, Checkbox, Tooltip, Table, Space } from 'antd';
 import { DeleteOutlined, CloseOutlined, CheckOutlined, PlusOutlined, QuestionCircleOutlined } from '@ant-design/icons';
 import { DndProvider, useDrag, useDrop } from 'react-dnd';
@@ -10,6 +10,7 @@ import { useContextMenu, Menu as RcMenu, Item as RcItem } from "react-contexify"
 import DebounceInput from './DebounceInput';
 import { addEventListenerForSidebar, removeEventListenerForSidebar } from './Help';
 import { showMessage, highlightSearchContentByTerms, inputWidth } from '../../../../util';
+import { EditModelContext } from './ContextManage';
 
 const { Option } = Select;
 
@@ -292,6 +293,8 @@ const ImportActionIndex = (props) => {
   const [ insertIndex, setInsertIndex ] = useState(0);
   const [ currentItem, setCurrentItem ] = useState(null);
 
+  const { indexIsEditingFunction } = useContext(EditModelContext);
+
   const dataRef = useRef();
   dataRef.current = data;
 
@@ -305,6 +308,11 @@ const ImportActionIndex = (props) => {
   useClickAway(() => {
     save();
   }, tableRef);
+
+  useEffect(() => {
+    indexIsEditingFunction && indexIsEditingFunction(editingKey!==null);
+    //eslint-disable-next-line react-hooks/exhaustive-deps    
+  }, [ editingKey ])
   
   //规则改变的时候 数据表为可编辑状态
   useEffect(() => {

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

-import React, { useState, useCallback, useRef, useEffect } from 'react';
+import React, { useState, useCallback, useRef, useEffect, useContext } from 'react';
 import { Input, Form, Typography, Button, Select, Row, Col, Popover, Checkbox, Tooltip, Table, Pagination, Space } from 'antd';
 import { CheckOutlined, PlusOutlined, QuestionCircleOutlined, DeleteOutlined } from '@ant-design/icons';
 import { DndProvider, useDrag, useDrop } from 'react-dnd';
@@ -16,6 +16,7 @@ import { AppContext } from '../../../../App';
 import DebounceInput from './DebounceInput';
 import SuggestTable from './SuggestTable';
 import { AttentionSvg, UnAttentionSvg } from './ModelSvg';
+import { EditModelContext } from './ContextManage';
 
 import './ImportActionTable.less';
 
@@ -298,6 +299,8 @@ const ImportActionTable = (props) => {
   const [ insertIndex, setInsertIndex ] = useState(0);
   const [ currentItem, setCurrentItem ] = useState(null);
 
+  const { attrIsEditingFunction } = useContext(EditModelContext);
+
   const moveRowRef = useRef({ data, pageNum, pageSize });
   const tableRef = useRef(null);
   const termsRef = useRef(null);
@@ -515,6 +518,11 @@ const ImportActionTable = (props) => {
     save();
   }, tableRef);
 
+  useEffect(() => {
+    attrIsEditingFunction && attrIsEditingFunction(editingKey!=='');
+    //eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [ editingKey ])
+
   //规则改变的时候 数据表为可编辑状态
   useEffect(() => {
     setEditingKey('');