模型可在不同目录移动

src/model/datamodel.js

@@ -78,6 +78,10 @@ export function* nextState(payload) {
   return yield call(datamodelerService.nextState, payload);
 }
 
+export function* recatalogDataModel(payload) {
+  return yield call(datamodelerService.recatalogDataModel, payload);
+}
+
 export function* extractExcelContent(payload) {
   return yield call(datamodelerService.extractExcelContent, payload);
 }

src/service/datamodeler.js

@@ -35,6 +35,10 @@ export function nextState(payload) {
   return GetJSON("/datamodeler/easyDataModelerCURD/nextState", payload);
 }
 
+export function recatalogDataModel(payload) {
+  return PostJSON("/datamodeler/easyDataModelerCURD/recatalogDataModel", payload);
+}
+
 export function extractExcelContent(payload) {
   return PostFile("/datamodeler/easyDataModelerDesign/kickStart", payload);
 }

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

@@ -14,7 +14,7 @@ const { Option } = Select;
 
 const ModelTable = (props) => {
 
-  const { data, onChange, onItemAction, onSelect, catalogId, onSearchInputChange, onModelStateChange, loadingStates, currentModelState, modelStates, view, keyword } = props;
+  const { data, onChange, onItemAction, onSelect, catalogId, onSearchInputChange, onModelStateChange, loadingStates, currentModelState, modelStates, view, keyword, onRecatalog } = props;
   const [ selectedRowKeys, setSelectedRowKeys ] = useState([]);
 
   const [modal, contextHolder] = Modal.useModal();
@@ -267,6 +267,11 @@ const ModelTable = (props) => {
         toolbar={{
           title: TitleComponent,
         }}
+        toolBarRender={() => [
+          <Button type='primary' onClick={() => { onRecatalog && onRecatalog(); }}>
+            模型变更目录
+          </Button>,
+        ]}
         sticky
       />
       { contextHolder }

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 } from '@ant-design/icons';
+import classnames from 'classnames';
 
 import UpdateTreeItemModal from './UpdateTreeItemModal';
 import { dispatch } from '../../../../model'; 
@@ -22,7 +23,7 @@ const viewModes = [
 
 const ModelTree = (props) => {
 
-  const { onSelect, onViewChange } = props;
+  const { onSelect, onViewChange, refrence='' } = props;
   const [ loading, setLoading ] = useState(false);
   const [ treeData, setTreeData ] = useState(null);
   const [ item, setItem ] = useState(null);
@@ -35,21 +36,25 @@ const ModelTree = (props) => {
 
   const [modal, contextHolder] = Modal.useModal();
 
-  const timestamp = getQueryParam(AnchorTimestamp, props.location.search);
-  const id = getQueryParam(AnchorId, props.location.search);
+  const timestamp = getQueryParam(AnchorTimestamp, props.location?.search||'');
+  const id = getQueryParam(AnchorId, props.location?.search||'');
 
   const itemRef = useRef();
   itemRef.current = null;
 
   useEffect(() => {
-    setViewSelectedKey(viewModes[0].key);
-    onViewChange && onViewChange(viewModes[0].key);
-
-    if ((id||'') !== '') {
-      getDataModelLocationThenGetDirTreeData();
-    } else {
+    if (refrence === 'recatalog') {
       getDirTreeData();
-    }  
+    } else {
+      setViewSelectedKey(viewModes[0].key);
+      onViewChange && onViewChange(viewModes[0].key);
+
+      if ((id||'') !== '') {
+        getDataModelLocationThenGetDirTreeData();
+      } else {
+        getDirTreeData();
+      }  
+    }
 
     //eslint-disable-next-line react-hooks/exhaustive-deps
   }, [timestamp])
@@ -124,7 +129,7 @@ const ModelTree = (props) => {
           setItem(defaultItem);
           onSelect && onSelect(defaultItem.key||'');
         
-        } else {
+        } else if (refrence === '') {
           
           let currentItem = itemRef.current;
 
@@ -303,9 +308,14 @@ const ModelTree = (props) => {
     </Menu>
   );
 
+  const classes = classnames('model-tree', {
+    'model-tree-recatalog': (refrence === 'recatalog')
+  });  
+
   return (
-    <div className='model-tree'>
-      <div
+    <div className={classes}>
+    {
+      (refrence==='') && <div
         className='p-3'
         style={{
           display: 'flex',
@@ -344,6 +354,7 @@ const ModelTree = (props) => {
           )
         }   
       </div>
+    }
       <div className='p-3'>
         <Spin spinning={loading} >
           <Tree 

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

@@ -4,4 +4,11 @@
     height: calc(100vh - @header-height - @pm-4 - 54px - @pm-3) !important;
     overflow: auto !important;
   }
+}
+
+.model-tree-recatalog {
+  .yy-tree-list {
+    height: 500px !important;
+    overflow: auto !important;
+  }
 }
\ No newline at end of file

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

+import React, { useState } from "react";
+import { Modal } from "antd";
+
+import { dispatch } from '../../../../model';
+import ModelTree from './ModelTree';
+import { showMessage } from '../../../../util';
+
+const RecatalogModal = (props) => {
+  
+  const { onCancel, visible, ids } = props;
+  const [ catalogId, setCatalogId ] = useState('');
+  const [ confirmLoading, setConfirmLoading ] = useState(false);
+
+  const onSelect = (value) => {
+    setCatalogId(value);
+  }
+
+  const onOk = () => {
+    if ((catalogId||'') === '') {
+      showMessage('warn', '请先选择模型目录');
+      return;
+    }
+    
+    setConfirmLoading(true);
+    dispatch({
+      type: 'datamodel.recatalogDataModel',
+      payload: {
+        params: {
+          easyDataModelCatalogId: catalogId,
+          easyDataModelerDataModelIds: ids.join(',')
+        },
+      },
+      callback: data => {
+        setConfirmLoading(false);
+
+        reset();
+        onCancel && onCancel(true);
+      },
+      error: () => {
+        setConfirmLoading(false);
+      }
+    })
+  }
+
+  const reset = () => {
+    setConfirmLoading(false);
+    setCatalogId('');
+  }
+
+  return(
+    <div>
+    {
+      visible && <Modal
+        title='变更目录详情'
+        visible={ visible }
+        width={ 400 }
+        confirmLoading={ confirmLoading }
+        onCancel={()=>{ 
+          reset();
+          onCancel && onCancel()
+        }}
+        onOk={ onOk }
+      >
+        <ModelTree
+          refrence='recatalog'
+          onSelect={onSelect} 
+        /> 
+      </Modal>
+    }
+    </div>
+  )
+}
+
+export default RecatalogModal;
\ No newline at end of file

src/view/Manage/Model/index.jsx

@@ -10,6 +10,7 @@ import ConstraintDetailDrawer from './Component/ConstraintDetailDrawer';
 import ImportModal from './Component/ImportModal';
 import ImportWordModal from './Component/ImportWordModal';
 import ExportDDLModal from './Component/ExportDDLModal';
+import RecatalogModal from './Component/RecatalogModal';
 import { showMessage, showNotifaction } from '../../../util';
 import { dispatch } from '../../../model'; 
 import { Action, CatalogId, ModelerId, Hints } from '../../../util/constant';
@@ -27,6 +28,7 @@ class Model extends React.Component {
       importModalVisible: false,
       importWordModalVisible: false,
       exportDDLModalVisible: false,
+      recatalogModalVisible: false,
       catalogId: '',
       importModalAction: '',
       importModalAddMode: '',
@@ -294,6 +296,16 @@ class Model extends React.Component {
     window.open(`/api/datamodeler/easyDataModelerExport/word/template?ids=${selectModelerIds.join(',')}`);
   }
 
+  onRecatalogBtnClick = () => {
+    const { selectModelerIds } = this.state;
+    if ((selectModelerIds||[]).length === 0) {
+      showMessage('info', '请先选择模型');
+      return;
+    }
+
+    this.setState({ recatalogModalVisible: true });
+  }
+
   onImportExcelVisibleChange = (visible = false, hint = null) => {
     this.setState({ importExcelVisible: visible });
   }
@@ -332,11 +344,20 @@ class Model extends React.Component {
     this.setState({ exportDDLModalVisible: false });
   }
 
+  onRecatalogModalCancel = (refresh = false) => {
+    this.setState({ recatalogModalVisible: false });
+    if (refresh) {
+      this.setState({ selectModelerIds: [] }, () => {
+        this.onTableChange();
+      });
+    }
+  }
+
   render() {
-    const { importModalVisible, catalogId, loadingTableData, selectModelerIds, keyword, filterTableData, selectModelerNames, importModalAddMode, exportErwinLoading, exportDDLModalVisible, templateCURDDrawerVisible, wordTemplateModalVisible, constraintDetailDrawerVisible, importWordModalVisible, loadingStates, modelStates, currentModelState, currentView } = this.state;
+    const { importModalVisible, catalogId, loadingTableData, selectModelerIds, keyword, filterTableData, selectModelerNames, importModalAddMode, exportErwinLoading, exportDDLModalVisible, templateCURDDrawerVisible, wordTemplateModalVisible, constraintDetailDrawerVisible, importWordModalVisible, loadingStates, modelStates, currentModelState, currentView, recatalogModalVisible } = this.state;
 
     const content = (
-      <ModelTable loading={loadingTableData} catalogId={catalogId} data={filterTableData} view={currentView} loadingStates={loadingStates} modelStates={modelStates} currentModelState={currentModelState} keyword={keyword} onChange={this.onTableChange} onSelect={this.onTableSelect} onItemAction={this.onTableItemAction} onModelStateChange={this.onModelStateChange} onSearchInputChange={this.onSearchInputChange} {...this.props} />
+      <ModelTable loading={loadingTableData} catalogId={catalogId} data={filterTableData} view={currentView} loadingStates={loadingStates} modelStates={modelStates} currentModelState={currentModelState} keyword={keyword} onChange={this.onTableChange} onSelect={this.onTableSelect} onItemAction={this.onTableItemAction} onModelStateChange={this.onModelStateChange} onSearchInputChange={this.onSearchInputChange} onRecatalog={this.onRecatalogBtnClick} {...this.props} />
     );
 
     return (
@@ -368,18 +389,20 @@ class Model extends React.Component {
             className='d-flex p-3'
             style={{
               borderBottom: '1px solid #EFEFEF',
-              justifyContent: 'space-between',
+              justifyContent: (currentView==='dir')?'space-between':'flex-end',
             }}
           >
-            <Space>
-              <span>模型创建:</span>
-              <Button type="primary" onClick={this.onImportExcelBtnClick}>Excel导入</Button>
-              <Button type="primary" onClick={this.onImportExcelCopyBtnClick}>Excel复制粘贴</Button>
-              <Button type="primary" onClick={this.onImportWordBtnClick}>Word导入</Button>
-              <Button type="primary" onClick={this.onImportModelBtnClick}>现有模型</Button>
-
-              {/* <Button type="primary" onClick={this.onImportDDLBtnClick}>DDL导入</Button> */}
-            </Space>  
+            {
+              currentView==='dir' && <Space>
+                <span>模型创建:</span>
+                <Button type="primary" onClick={this.onImportExcelBtnClick}>Excel导入</Button>
+                <Button type="primary" onClick={this.onImportExcelCopyBtnClick}>Excel复制粘贴</Button>
+                <Button type="primary" onClick={this.onImportWordBtnClick}>Word导入</Button>
+                <Button type="primary" onClick={this.onImportModelBtnClick}>现有模型</Button>
+
+                {/* <Button type="primary" onClick={this.onImportDDLBtnClick}>DDL导入</Button> */}
+              </Space>  
+            }
             <Space>
               <span>模型导出:</span>
               <Button type="primary" onClick={this.onExportDDLBtnClick}>导出DDL</Button>
@@ -430,6 +453,14 @@ class Model extends React.Component {
           names={selectModelerNames}
           onCancel={this.onExportDDLModalCancel} 
         /> 
+
+        <RecatalogModal
+          visible={recatalogModalVisible}
+          ids={selectModelerIds}
+          onCancel={this.onRecatalogModalCancel}
+        >
+        
+        </RecatalogModal>
       </div>
     );
   }