编辑页面

public/react/src/modules/developer/newOrEditTask/leftpane/editorTab/index.js

@@ -1,17 +1,41 @@
 import React, { PureComponent } from 'react';
-import { Form } from 'antd';
-import connect from 'react-redux';
+import { Form, Input, Button } from 'antd';
 
+const FormItem = Form.Item;
 class EditTab extends PureComponent {
 
+  handleSubmit = (e) => {
+    e.preventDefault();
+    this.props.form.validateFieldsAndScroll((err, value) => {
+      if (!err) {
+        console.log(value);
+      }
+    })
+  }
+
   render () {
+    const { form } = this.props;
+    const { getFieldDecorator } = form;
     return (
       <div className={'editor_area'}>
-        
+        <Form onSubmit={this.handleSubmit}>
+          <FormItem label="任务名称">
+            { getFieldDecorator('name', {
+              rules: [
+                {
+                  required: true, message: '任务名称不能为空'
+                }
+              ]
+            })(<Input placeholder="请输入任务名称" />)}
+          </FormItem>
+          <FormItem>
+            <Button htmlType="submit">提交</Button>
+          </FormItem>
+        </Form>
       </div>
     )
   }
 }
 
-// export default connect()(EditTab);
-export default EditTab;
+const EditTabForm = Form.create()(EditTab);
+export default EditTabForm;

public/react/src/modules/developer/newOrEditTask/leftpane/index.js

@@ -3,7 +3,7 @@
  * @Author: tangjiang 
  * @Date: 2019-11-19 11:35:30 
  * @Last Modified by: tangjiang
- * @Last Modified time: 2019-11-19 11:36:10
+ * @Last Modified time: 2019-11-19 19:07:02
  */
 
 import './index.scss';
@@ -12,24 +12,25 @@ import { Tabs } from 'antd';
 import EditorTab from './editorTab';
 import PrevTab from './prevTab';
 import CommitTab from './commitTab';
+// import * from 'rc-form';
 
 const { TabPane } = Tabs;
 
 const LeftPane = () => {
 
-  const [defaultActiveKey, setDefaultActiveKey] = useState('prev');
+  const [defaultActiveKey, setDefaultActiveKey] = useState('editor');
 
   const tabArrs = [
-    { title: '编辑', key: 'editor', content: EditorTab },
-    { title: '预览',  key: 'prev', content: PrevTab },
-    { title: '提交记录',  key: 'commit', content: CommitTab },
+    { title: '编辑', key: 'editor', content: (<EditorTab wrappedComponentRef={(ref) => this.form} />) },
+    { title: '预览',  key: 'prev', content: (<PrevTab />) },
+    { title: '提交记录',  key: 'commit', content: (<CommitTab />) },
   ];
 
   const tabs = tabArrs.map((tab) => {
     const Comp = tab.content;
     return (
       <TabPane tab={tab.title} key={tab.key}>
-        <Comp />
+        { Comp }
       </TabPane>
     )
   });