模型主页面导入调整

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

@@ -22,6 +22,11 @@ class ImportExcel extends React.Component {
     window.open("/data-govern/docs/DataModel.xlsx");
   }
 
+  normFile = (e) => {  
+    const { fileList } = this.state;
+    return fileList;
+  };
+
   render() {
 
     const { onChange } = this.props;
@@ -33,8 +38,6 @@ class ImportExcel extends React.Component {
         const newFileList = fileList.slice();
         newFileList.splice(index, 1);
 
-        onChange && onChange(newFileList);
-
         this.setState({ fileList: newFileList });
       },
       beforeUpload: file => {
@@ -42,7 +45,6 @@ class ImportExcel extends React.Component {
         onChange && onChange([file]);
         this.setState({ fileList: [file] });
 
-        console.log('file', file);
         return false;
       },
       accept:".xlsx",
@@ -51,12 +53,15 @@ class ImportExcel extends React.Component {
 
     return (
       <Form.Item 
-        name='upload'
         label='文件上传'
+        required={true} 
       >
         <Row>
           <Col span={9}>
             <Form.Item
+              name='upload'
+              valuePropName="fileList"
+              getValueFromEvent={this.normFile}
               noStyle
               rules={[
                 {

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

@@ -15,7 +15,7 @@ const importModes = [
 ] 
 
 const ImportModal = (props) => {
-  const { catalogId, visible, onCancel } = props;
+  const { view, catalogId, visible, onCancel } = props;
 
   const [ modeKey, setModeKey ] = useState('');
   const [ files, setFiles ] = useState([]);
@@ -29,17 +29,12 @@ const ImportModal = (props) => {
   }
 
   const onOk = async() => {
+    try {
 
-    if (modeKey === '') {
-      form.setFields([{ name: 'mode', errors: ['请选择导入方式'] }]);
-      return;
-    }
+      const row = await form.validateFields();
    
       if (modeKey==='word') {
   
-      if ((files||[]).length === 0) {
-        form.setFields([{ name: 'upload', errors: ['请选择文件上传'] }]);
-      } else {
         setConfirmLoading(true);
         dispatchLatest({
           type: 'datamodel.importWordGenerateModelDraft',
@@ -47,7 +42,7 @@ const ImportModal = (props) => {
             params: {
               catalogId,
             },
-            files 
+            fileList: row.upload 
           },
           callback: data => {
             setConfirmLoading(false);
@@ -58,36 +53,38 @@ const ImportModal = (props) => {
             setConfirmLoading(false);
           }
         });
-      } 
   
       } else if (modeKey==='excel') {
   
-      if ((files||[]).length === 0) {
-        form.setFields([{ name: 'upload', errors: ['请选择文件上传'] }]);
-      } else {
         setConfirmLoading(true);
         dispatchLatest({
           type: 'datamodel.extractExcelContent',
-          payload: { fileList: files },
+          payload: { fileList: row.upload },
           callback: data => {
             setConfirmLoading(false);
+            reset();
             onCancel && onCancel(false, data||[]);
           },
           error: () => {
             setConfirmLoading(false);
           }
         })
-      } 
   
       } else if (modeKey==='excel-copy') {
   
         if ((hints||[]).length === 0) {
           showMessage('warn', '请先从Excel文件中复制内容');
         } else {
+          reset();
           onCancel && onCancel(false, hints||[]);
         }
   
       } 
+
+    } catch (errInfo) {
+      console.log('Validate Failed:', errInfo);
+    }
+
   }
 
   const cancel = () => {
@@ -96,20 +93,13 @@ const ImportModal = (props) => {
   }
 
   const reset = () => {
+    form.resetFields();
     setModeKey('');
     setFiles([]);
     setHints([]);
     setConfirmLoading(false);
   }
 
-  const onImportWordChange = (files) => {
-    setFiles(files||[]);
-  }
-
-  const onImportExcelChange = (files) => {
-    setFiles(files||[]);
-  }
-
   const onImportExcelCopyChange = (data) => {
     setHints(data||[]);
   }
@@ -117,7 +107,6 @@ const ImportModal = (props) => {
   const footer = [ 
     <Button
       key="0" 
-      type="primary"
       onClick={cancel}
     >
     取消
@@ -145,23 +134,34 @@ const ImportModal = (props) => {
         <Form.Item 
           name='mode'
           label='导入方式'
+          rules={[
+            {
+              required: true,
+              message: '请选择导入方式',
+            },
+          ]}
         >
           <Radio.Group onChange={onModeChange} value={modeKey}>
           {
             importModes.map((item, index) => {
-              return <Radio value={item.key} key={index}>{item.name}</Radio>;
+              return <Radio 
+                value={item.key} 
+                key={index} 
+                disabled={item.key==='word'&&(view!=='dir'||(catalogId||'') === '')}>
+                {item.name}
+              </Radio>;
             })
           }
           </Radio.Group>
         </Form.Item>
         {
           modeKey==='word' && (
-            <ImportWord onChange={onImportWordChange} {...props} />
+            <ImportWord {...props} />
           )
         }
         {
           modeKey==='excel' && (
-            <ImportExcel onChange={onImportExcelChange} {...props} />
+            <ImportExcel {...props} />
           )
         }
         {

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

@@ -10,6 +10,10 @@ const ImportWord = (props) => {
     setFileList([]);
   }, [visible])
 
+  const normFile = () => {
+    return fileList;
+  }
+
   const uploadProps = {
     onRemove: file => {
 
@@ -34,6 +38,14 @@ const ImportWord = (props) => {
     <Form.Item 
       name='upload'
       label='文件上传' 
+      valuePropName="fileList"
+      getValueFromEvent={normFile}
+      rules={[
+        {
+          required: true,
+          message: '请选择文件上传',
+        },
+      ]}
     >
       <Upload {...uploadProps}>
         <Button icon={<UploadOutlined />}>

src/view/Manage/Model/index.jsx

@@ -202,17 +202,6 @@ class Model extends React.Component {
     window.open(`/data-govern/data-model-action?${Action}=add&${CatalogId}=${(currentView==='dir')?(catalogId||''):''}`);
   }
 
-  // onImportWordBtnClick = () => {
-  //   const { catalogId, currentView } = this.state;
-    
-  //   if (currentView!=='dir' || (catalogId||'') === '') {
-  //     showMessage('info', '请先选择模型目录');
-  //     return;
-  //   }
-
-  //   this.setState({ importWordModalVisible: true });
-  // }
-
   onImportModelBtnClick = () => {
     const { catalogId, selectModelerIds, currentView } = this.state;
 
@@ -341,14 +330,14 @@ class Model extends React.Component {
   }
 
   onImportModalCancel = (refresh = false, hints = [], wordData = {}) => {
-    const { catalogId, importModalAction, currentView } = this.state;
+    const { catalogId, currentView } = this.state;
 
     this.setState({ importModalVisible: false }, () => {
       refresh && this.onTableChange();
 
       if ((hints||[]).length > 0) {
         setTimeout(() => {
-          window.open(`/data-govern/data-model-action?${Action}=${importModalAction}&${CatalogId}=${(currentView==='dir')?(catalogId||''):''}&${Hints}=${encodeURIComponent((hints||[]).join(','))}`);
+          window.open(`/data-govern/data-model-action?${Action}=add&${CatalogId}=${(currentView==='dir')?(catalogId||''):''}&${Hints}=${encodeURIComponent((hints||[]).join(','))}`);
         }, 1000);
       }
 
@@ -560,6 +549,8 @@ class Model extends React.Component {
         />
 
         <ImportModal 
+          view={currentView}
+          catalogId={catalogId}
           visible={importModalVisible} 
           onCancel={this.onImportModalCancel}
         />