模型搜索

src/model/datamodel.js

@@ -217,3 +217,7 @@ export function* getSchemasByDatasourceId(payload) {
 export function* autoCreateTable(payload) {
   return yield call(datamodelerService.autoCreateTable, payload);
 }
+
+export function* searchModel(payload) {
+  return yield call(datamodelerService.searchModel, payload);
+}

src/service/datamodeler.js

@@ -121,6 +121,10 @@ export function getDataModelLocation(payload) {
   return GetJSON("/datamodeler/easyDataModelerCURD/getDataModelLocation", payload);
 }
 
+export function searchModel(payload) {
+  return GetJSON("/datamodeler/easyDataModelerCURD/searchEasyDataModelerDataModelsByNaming", payload);
+}
+
 export function ddlGenerators() {
   return GetJSON("/datamodeler/easyDataModelerExport/ddlGenerators");
 }

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

+import React, { useState } from "react";
+import { Modal } from "antd";
+
+import ModelTree from './ModelTree';
+import { showMessage } from '../../../../util';
+
+const CatalogModal = (props) => {
+  
+  const { onCancel, visible } = props;
+  const [ catalogId, setCatalogId ] = useState('');
+
+  const onSelect = (value) => {
+    setCatalogId(value);
+  }
+
+  const onOk = () => {
+    if ((catalogId||'') === '') {
+      showMessage('warn', '请先选择模型目录');
+      return;
+    }
+    
+    onCancel && onCancel(catalogId);
+  }
+
+  const reset = () => {
+    setCatalogId('');
+  }
+
+  return(
+    <Modal
+        title='选择目录'
+        visible={ visible }
+        width={ 400 }
+        onCancel={()=>{ 
+          reset();
+          onCancel && onCancel()
+        }}
+        onOk={ onOk }
+      >
+      {
+        visible && <ModelTree
+          refrence='recatalog'
+          onSelect={onSelect} 
+        />
+      } 
+      </Modal>
+  )
+}
+
+export default CatalogModal;
\ No newline at end of file

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

@@ -2,6 +2,7 @@ import React, { useState, useEffect } from 'react';
 import { Form, Button, Space } from 'antd';
 
 import ImportAction from './ImportAction';
+import CatalogModal from './CatalogModal';
 import { dispatchLatest } from '../../../../model'; 
 import { getQueryParam, showMessage } from '../../../../util';
 import { Action, CatalogId, ModelerId, Hints, ModelerData } from '../../../../util/constant';
@@ -13,6 +14,7 @@ const EditModel = (props) => {
   const [ modelerData, setModelerData ] = useState({});
   const [ terms, setTerms ] = useState([]);
   const [ confirmLoading, setConfirmLoading ] = useState(false);
+  const [ catalogModalVisible, setCatalogModalVisible ] = useState(false);
 
   const { action, catalogId, modelerId, hints, roughModelerData } = actionData;
 
@@ -40,7 +42,7 @@ const EditModel = (props) => {
     //eslint-disable-next-line react-hooks/exhaustive-deps
   }, [])
 
-  const save = async () => {
+  const save = async (e, cid = '') => {
     try {
       const row = await form.validateFields();
 
@@ -48,6 +50,11 @@ const EditModel = (props) => {
 
       if (newModelerData.easyDataModelerModelingTemplate==='' || newModelerData.easyDataModelerModelingTemplate==={}) {
         newModelerData.easyDataModelerModelingTemplate = null;
+      } 
+
+      if (action==='add' && (cid||'')==='' && ((catalogId||'')==='')) {
+        setCatalogModalVisible(true);
+        return ;
       }
 
       setConfirmLoading(true);
@@ -57,25 +64,32 @@ const EditModel = (props) => {
           data: newModelerData
         },
         callback: data => {
-          dispatchLatest({
-            type: 'datamodel.bindCatalogDataModel',
-            payload: { 
-              params: {
-                easyDataModelCatalogId: catalogId,
-                easyDataModelerDataModelIds: data.id||''
+          if (action === 'add') {
+            dispatchLatest({
+              type: 'datamodel.bindCatalogDataModel',
+              payload: { 
+                params: {
+                  easyDataModelCatalogId: ((cid||'')!=='')?cid:catalogId,
+                  easyDataModelerDataModelIds: data.id||''
+                }
+              },
+              callback: () => {
+                setConfirmLoading(false);
+
+                showMessage("success", '新增模型成功');
+                setActionData({ ...actionData, ...{ action: 'detail', modelerId: data.id||'' } });
+
+              },
+              error: () => {
+                setConfirmLoading(false);
               }
-            },
-            callback: () => {
-              setConfirmLoading(false);
-
-              showMessage("success", (action==='add')?'新增模型成功':'保存模型成功')
-              setActionData({ ...actionData, ...{ action: 'detail', modelerId: data.id||'' } });
-
-            },
-            error: () => {
-              setConfirmLoading(false);
-            }
-          })
+            })
+          } else {
+            setConfirmLoading(false);
+
+            showMessage("success", '保存模型成功');
+            setActionData({ ...actionData, ...{ action: 'detail', modelerId: data.id||'' } });
+          }
         },
         error: (err) => {
           setConfirmLoading(false);
@@ -101,6 +115,11 @@ const EditModel = (props) => {
     setModelerData(data);
   }
 
+  const onCatalogModalCancel = (id) => {
+    setCatalogModalVisible(false);
+    save(null, id);
+  }
+
   let title = '';
   if (action === 'add') {
     title = '新增模型';
@@ -169,6 +188,10 @@ const EditModel = (props) => {
           <ImportAction hints={hints} onChange={onActionChange} action={action} modelerId={modelerId} form={form} terms={terms} roughModelerData={roughModelerData} /> 
         </div>     
       </div>
+      <CatalogModal
+        visible={catalogModalVisible}
+        onCancel={onCatalogModalCancel}
+      />
     </div>
   );
 } 

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

@@ -660,6 +660,7 @@ const ImportActionTable = (props) => {
       dataIndex: 'remark',
       editable: true,
       ellipsis: true,
+      require: true,
       width: 200,
       render: (text, _, __) => {
         return (

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

 import React, { useState, useEffect, useRef } from "react";
-import { Tooltip, Tree, Modal, Spin, Dropdown, Menu } from "antd";
-import { PlusOutlined, EditOutlined, SyncOutlined, DeleteOutlined, UnorderedListOutlined, ImportOutlined } from '@ant-design/icons';
+import { Tooltip, Tree, Modal, Spin } from "antd";
+import { PlusOutlined, EditOutlined, SyncOutlined, DeleteOutlined, ImportOutlined } from '@ant-design/icons';
 import classnames from 'classnames';
 
 import UpdateTreeItemModal from './UpdateTreeItemModal';
@@ -23,10 +23,11 @@ const viewModes = [
 
 const ModelTree = (props) => {
 
-  const { onSelect, onViewChange, refrence='', importStockModel } = props;
+  const { onSelect, onViewChange, refrence='', importStockModel, keyword } = props;
   const [ loading, setLoading ] = useState(false);
   const [ treeData, setTreeData ] = useState(null);
   const [ item, setItem ] = useState(null);
+  const [ prevItem, setPrevItem ] = useState(null);
   const [ visible, setVisible ] = useState(false);
   const [ type, setType ] = useState(null);
   const [ rootId, setRootId ] = useState('');
@@ -59,6 +60,24 @@ const ModelTree = (props) => {
     //eslint-disable-next-line react-hooks/exhaustive-deps
   }, [timestamp])
 
+  useEffect(() => {
+
+    if (keyword!=='') {
+      if (item) {
+        setPrevItem(item);
+      }
+
+      setItem(null);
+    } else {
+      if (prevItem && !item) {
+        setItem(prevItem);
+        onSelect && onSelect(prevItem?.key||'');
+      }
+    }
+
+    //eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [ keyword ])
+
   const getDataModelLocationThenGetDirTreeData = () => {
     setLoading(true);
     dispatch({
@@ -205,20 +224,20 @@ const ModelTree = (props) => {
     setAutoExpandParent(false);
   };
 
-  const onViewClick = ({ key }) => {
+  // const onViewClick = ({ key }) => {
 
-    if (viewSelectedKey &&  viewSelectedKey===key ) return;
+  //   if (viewSelectedKey &&  viewSelectedKey===key ) return;
 
-    itemRef.current = null;
-    setViewSelectedKey(key);
-    onViewChange && onViewChange(key);
+  //   itemRef.current = null;
+  //   setViewSelectedKey(key);
+  //   onViewChange && onViewChange(key);
 
-    if (key === 'dir') {
-      getDirTreeData();
-    } else {
-      getStateTreeData();
-    }
-  }
+  //   if (key === 'dir') {
+  //     getDirTreeData();
+  //   } else {
+  //     getStateTreeData();
+  //   }
+  // }
 
   const onTreeSelect = (keys,data) => {
 
@@ -297,17 +316,17 @@ const ModelTree = (props) => {
     setVisible(false);
   }
 
-  const exportMenu = (
-    <Menu selectedKeys={[viewSelectedKey]} onClick={onViewClick}>
-    {
-      viewModes && viewModes.map(item => {
-        return (
-          <Menu.Item key={item.key} value={item.key} >{item.name}</Menu.Item>
-        )
-      })
-    }
-    </Menu>
-  );
+  // const exportMenu = (
+  //   <Menu selectedKeys={[viewSelectedKey]} onClick={onViewClick}>
+  //   {
+  //     viewModes && viewModes.map(item => {
+  //       return (
+  //         <Menu.Item key={item.key} value={item.key} >{item.name}</Menu.Item>
+  //       )
+  //     })
+  //   }
+  //   </Menu>
+  // );
 
   const classes = classnames('model-tree', {
     'model-tree-recatalog': (refrence === 'recatalog')

src/view/Manage/Model/index.jsx

@@ -99,32 +99,49 @@ class Model extends React.Component {
   }
 
   onTableChange = () => {
-    const { currentView, catalogId } = this.state;
+    const { currentView, catalogId, keyword } = this.state;
 
     this.setState({ loadingTableData: true }, () => {
-      if (currentView === 'dir') {
-        dispatch({
-          type: 'datamodel.getCurrentDataModelCatalog',
-          payload: {
-            easyDataModelerCatalogId: catalogId
-          },
-          callback: data => {
-            this.setState({ loadingTableData: false, tableData: data.easyDataModelerDataModels||[] }, () => {
-              this.setFilterData();
-            });
-          },
-          error: () => {
-            this.setState({ loadingTableData: false });
-          }
-        })
+      if (keyword === '') {
+        if (currentView === 'dir') {
+          dispatch({
+            type: 'datamodel.getCurrentDataModelCatalog',
+            payload: {
+              easyDataModelerCatalogId: catalogId
+            },
+            callback: data => {
+              this.setState({ loadingTableData: false, tableData: data.easyDataModelerDataModels||[] }, () => {
+                this.setFilterData();
+              });
+            },
+            error: () => {
+              this.setState({ loadingTableData: false });
+            }
+          })
+        } else {
+          dispatch({
+            type: 'datamodel.getCurrentDataModelStateCatalog',
+            payload: {
+              easyDataModelerStateCatalogId: catalogId
+            },
+            callback: data => {
+              this.setState({ loadingTableData: false, tableData: data.easyDataModelerDataModels||[] }, () => {
+                this.setFilterData();
+              });
+            },
+            error: () => {
+              this.setState({ loadingTableData: false });
+            }
+          })
+        }
       } else {
         dispatch({
-          type: 'datamodel.getCurrentDataModelStateCatalog',
+          type: 'datamodel.searchModel',
           payload: {
-            easyDataModelerStateCatalogId: catalogId
+            term: keyword,
           },
           callback: data => {
-            this.setState({ loadingTableData: false, tableData: data.easyDataModelerDataModels||[] }, () => {
+            this.setState({ loadingTableData: false, tableData: data||[] }, () => {
               this.setFilterData();
             });
           },
@@ -150,8 +167,10 @@ class Model extends React.Component {
   }
 
   onSearchInputChange = (e) => {
-    this.setState({ keyword: e.target.value||'' }, () => {
-      this.setFilterData();
+    this.setState({ keyword: e.target.value||'', catalogId: '' }, () => {
+      if (e.target.value !== '') {
+        this.onTableChange();
+      }
     });
   }
 
@@ -168,60 +187,33 @@ class Model extends React.Component {
   }
 
   setFilterData = () => {
-    const { keyword, tableData, currentModelState } = this.state;
+    const { tableData, currentModelState } = this.state;
 
-    const _filterData = (tableData||[]).filter(item => (currentModelState===''||currentModelState===item.state?.id) && ((item.name||'').indexOf(keyword)!==-1||(item.cnName).indexOf(keyword)!==-1));
+    const _filterData = (tableData||[]).filter(item => (currentModelState===''||currentModelState===item.state?.id));
 
     this.setState({ filterTableData: _filterData });
   }
 
   onImportUnconditionBtnClick = () => {
     const { catalogId } = this.state;
-    if (!catalogId || catalogId==='') {
-      showMessage('info', '请先选择目录');
-      return;
-    }
 
-    window.open(`/data-govern/data-model-action?${Action}=add&${CatalogId}=${catalogId}`);
+    window.open(`/data-govern/data-model-action?${Action}=add&${CatalogId}=${catalogId||''}`);
   }
 
   onImportExcelBtnClick = () => {
-    const { catalogId } = this.state;
-    if (!catalogId || catalogId==='') {
-      showMessage('info', '请先选择目录');
-      return;
-    }
-
     this.setState({ importModalVisible: true, importModalAction: 'add', importModalAddMode: 'excel' });
   }
 
   onImportExcelCopyBtnClick = () => {
-    const { catalogId } = this.state;
-    if (!catalogId || catalogId==='') {
-      showMessage('info', '请先选择目录');
-      return;
-    }
-
     this.setState({ importModalVisible: true, importModalAction: 'add', importModalAddMode: 'excel-copy' });
   }
 
   onImportWordBtnClick = () => {
-    const { catalogId } = this.state;
-    if (!catalogId || catalogId==='') {
-      showMessage('info', '请先选择目录');
-      return;
-    }
-
     this.setState({ importWordModalVisible: true });
-    
   }
 
   onImportModelBtnClick = () => {
     const { catalogId, selectModelerIds } = this.state;
-    if (!catalogId || catalogId==='') {
-      showMessage('info', '请先选择目录');
-      return;
-    }
 
     if ((selectModelerIds||[]).length === 0) {
       showMessage('info', '请先选择一个模型');
@@ -233,16 +225,10 @@ class Model extends React.Component {
       return;
     }
 
-    window.open(`/data-govern/data-model-action?${Action}=add&${CatalogId}=${catalogId}&${ModelerId}=${selectModelerIds[0]}`);
+    window.open(`/data-govern/data-model-action?${Action}=add&${CatalogId}=${catalogId||''}&${ModelerId}=${selectModelerIds[0]}`);
   }
 
   onImportDDLBtnClick = () => {
-    const { catalogId } = this.state;
-    if (!catalogId || catalogId==='') {
-      showMessage('info', '请先选择目录');
-      return;
-    }
-
     this.setState({ importModalVisible: true, importModalAction: 'add', importModalAddMode: 'ddl' });
   }
 
@@ -516,7 +502,7 @@ class Model extends React.Component {
     return (
       <div className='data-model'>
         <div className='left'>
-          <ModelTree onViewChange={this.onViewChange} onSelect={this.onTreeSelect} importStockModel={this.importStockModel} {...this.props} />
+          <ModelTree onViewChange={this.onViewChange} onSelect={this.onTreeSelect} importStockModel={this.importStockModel} keyword={keyword} {...this.props} />
         </div> 
         <div className='right'>
           <div
@@ -538,7 +524,7 @@ class Model extends React.Component {
            
               <Space>
                 <Input 
-                  placeholder="请输入模型名称或者中文名称" 
+                  placeholder="请输入关键字" 
                   allowClear 
                   value={keyword}
                   onChange={(e) => { this.onSearchInputChange(e); }}