baozhangchao 3 years ago
parent
commit
9fb81c47ef

+ 0
- 8
src/pages/home/Recommend/index.jsx View File

@@ -5,14 +5,6 @@ import request from '../../../utils/request';
5 5
 import apis from '../../../services/apis';
6 6
 import QueryTable from '@/components/QueryTable'
7 7
 import { router } from 'umi';
8
-import { render } from 'enzyme';
9
-import WxDictSelect from '@/components/SelectButton/WxDictSelect';
10
-import BuildingSelect from '@/components/SelectButton/BuildSelect';
11
-import renderAuthorize from '@/components/Authorized/renderAuthorize';
12
-import { setLocale } from 'umi-plugin-locale';
13
-import { fromPairs } from 'lodash';
14
-import { backgroundColor } from 'echarts/lib/theme/dark';
15
-
16 8
 
17 9
 
18 10
 /**

+ 120
- 2
src/pages/staff/Organization/form.jsx View File

@@ -1,4 +1,122 @@
1
+import React from 'react'
2
+import { Row, Col, Card, Tree, DatePicker, Radio,Form, Select, Input,InputNumber, Button } from 'antd';
1 3
 
2
-export default (props) => {
3 4
 
4
-}
5
+import ImageUpload from '@/components/XForm/ImageUpload';
6
+
7
+const { Option } = Select;
8
+const FormItem = Form.Item;
9
+const {RangePicker}=DatePicker
10
+
11
+const formItemLayout = {
12
+    labelCol: { span: 6 },
13
+    wrapperCol: { span: 14 },
14
+};
15
+
16
+class TreedataFrom extends React.Component {
17
+  handleSubmit = e => {
18
+    e.preventDefault();
19
+    this.props.form.validateFields((err, values) => {
20
+      if (!err) {
21
+        console.log('Received values of form: ', values);
22
+      }
23
+    });
24
+  };
25
+
26
+  handleSelectChange = value => {
27
+    console.log(value);
28
+    this.props.form.setFieldsValue({
29
+      note: `Hi, ${value === 'male' ? 'man' : 'lady'}!`,
30
+    });
31
+  };
32
+
33
+  render() {
34
+    const { getFieldDecorator } = this.props.form;
35
+    return (
36
+      <Form {...formItemLayout} onSubmit={this.handleSubmit}>
37
+        <FormItem label="照片" help="建议尺寸:750px*600px,比例5:4,格式:jpg,用于:列表和详情">
38
+          {
39
+            getFieldDecorator('curriculumImg', {
40
+              rules: [
41
+                { required: true, message: '请上传照片' }
42
+              ]
43
+            })(
44
+              <ImageUpload />
45
+            )
46
+          }
47
+        </FormItem>
48
+        <FormItem label="姓名">
49
+          {getFieldDecorator('note', {
50
+            rules: [{ required: true, message: '请输入姓名!' }],
51
+          })(<Input />)}
52
+        </FormItem>
53
+        <FormItem label="年龄" >
54
+           {
55
+            getFieldDecorator('weight', {
56
+              rules: [{ required: true, message: '请输入年龄' }]
57
+            })(
58
+              <InputNumber min='18' />
59
+            )
60
+          }
61
+        </FormItem>
62
+        <FormItem label="性别">
63
+          {
64
+            getFieldDecorator('type', {
65
+              rules: [
66
+                { required: true, message: '请选择性别' }
67
+              ]
68
+            })(
69
+              <Radio.Group  style={{ width: '500px' }} defaultValue={1}>
70
+                {/* onChange={e => setContentType(e.target.value)} */}
71
+                <Radio value={1}>男</Radio>
72
+                <Radio value={2}>女</Radio>
73
+              </Radio.Group>
74
+            )
75
+          }
76
+        </FormItem>
77
+        <FormItem label="工作总时间" style={{ marginBottom: 0 }} help="如未离职,结束日期和开始日期一样即可">
78
+          <FormItem style={{ display: 'inline-block' }} >
79
+            <RangePicker style={{width: '255px'}}/>
80
+          </FormItem>
81
+        </FormItem>
82
+        <FormItem label="Gender">
83
+          {getFieldDecorator('gender', {
84
+            rules: [{ required: true, message: 'Please select your gender!' }],
85
+          })(
86
+            <Select
87
+              placeholder="Select a option and change input text above"
88
+              onChange={this.handleSelectChange}
89
+            >
90
+              <Option value="male">male</Option>
91
+              <Option value="female">female</Option>
92
+            </Select>,
93
+          )}
94
+        </FormItem>
95
+        <FormItem wrapperCol={{ span: 12, offset: 5 }}>
96
+          <Button type="primary" htmlType="submit">
97
+            Submit
98
+          </Button>
99
+        </FormItem>
100
+      </Form>
101
+    );
102
+  }
103
+}
104
+
105
+
106
+TreedataFrom = Form.create({})(TreedataFrom);
107
+
108
+export default TreedataFrom
109
+
110
+
111
+
112
+
113
+// import React from 'react'
114
+
115
+// class Hello extends React.Component{
116
+//     render(){
117
+//         return<h1>asdasdasdas</h1>
118
+//     }
119
+// }
120
+
121
+
122
+// export default Hello

+ 102
- 46
src/pages/staff/Organization/index.jsx View File

@@ -205,68 +205,124 @@
205 205
 
206 206
 
207 207
 
208
-import { Row, Col, Card, Tree, DatePicker, Form, Input, InputNumber, Radio, Button } from 'antd'
209
-import React, { useEffect, useState, useCallback } from 'react';
210
-import ImageUpload from '@/components/XForm/ImageUpload';
211 208
 
212
-// import userTrees from './tree'
213 209
 
214
-const { TreeNode, DirectoryTree } = Tree
215
-const FormItem = Form.Item;
216 210
 
217 211
 
218 212
 
219 213
 
220
-const userTree = React.forwardRef((props, ref) => {
221
-  const [loading, setLoading] = useState(false);//防止多次点击 定义loadind
222
-  // const [formData, setFormData] = useState();//提交表单的数据
223
-  const [contentType, setContentType] = useState(1);//单选。初始默认显示1 富文本框。点击视频, 渲染2
224
-  const { form, history } = props;
225
-  const { getFieldDecorator, setFieldsValue, validateFields } = form;
226
-  const {RangePicker} = DatePicker;
227
-  const { curriculumId } = history.location.query || {}
228
-  const formItemLayout = {
229
-    //布局
230
-    labelCol: { span: 6 },
231
-    wrapperCol: { span: 14 },
214
+import { Row, Col, Card, Tree, DatePicker, Form, Input, InputNumber, Radio, Button } from 'antd'
215
+import { title } from 'echarts/lib/theme/dark';
216
+import React, { useEffect, useState, useCallback,useRef } from 'react';
217
+import TreedataFrom from './form';
218
+
219
+const { TreeNode,DirectoryTree } = Tree;
220
+
221
+// const [treeData, settreeData] = useState([])
222
+
223
+
224
+const treeData = [
225
+  {
226
+    title: '分厂厂长管理',
227
+    key: '0-0',
228
+    children: [
229
+        { title: '刘厂长', key: '0-0-0-1' },
230
+        { title: '王副厂长', key: '0-0-0-2' },
231
+    ],
232
+  },
233
+  {
234
+      title: '分厂员工管理',
235
+      key: '0-0-1',
236
+      children: [
237
+        { title: '王王王', key: '0-0-1-0' },
238
+        { title: '张张张', key: '0-0-1-1' },
239
+        { title: '刘刘刘', key: '0-0-1-2' },
240
+      ],
241
+  },
242
+];
243
+
244
+class Demo extends React.Component {
245
+
246
+  state = {
247
+    expandedKeys: ['0-0', '0-0-1'],
248
+    autoExpandParent: false,
249
+    checkedKeys: ['0-0-1'],
250
+    selectedKeys: [],
251
+  };
252
+
253
+  onExpand = expandedKeys => {
254
+    //自动展开
255
+    console.log('onExpand', expandedKeys);
256
+      // 如果没有将 autoExpandParent 设置为 false,如果子项展开,父项不能折叠。
257
+     // 或者,您可以删除所有扩展的子键。
258
+    this.setState({
259
+      expandedKeys,
260
+      autoExpandParent: false,
261
+    });
262
+  };
263
+
264
+  onCheck = checkedKeys => {
265
+    //单击复选框
266
+    console.log('onCheck', checkedKeys);
267
+    this.setState({ checkedKeys });
268
+    
269
+  };
232 270
 
271
+  onSelect = (selectedKeys, info) => {
272
+    //单击姓名
273
+    for (let i = 0; i < selectedKeys.length; i++) {
274
+      const element = selectedKeys[i];
275
+      console.log(element);
276
+  }
277
+  
278
+    console.log('onSelect',info);
279
+    this.setState({ selectedKeys });
233 280
   };
234 281
 
235
-  return (
236
-    <Card>
237
-      <Row justify='center'>
282
+  renderTreeNodes = data =>
283
+    data.map(item => {
284
+      if (item.children) {
285
+        return (
286
+          <TreeNode title={item.title} key={item.key} dataRef={item}  >
287
+            {this.renderTreeNodes(item.children)}
288
+          </TreeNode>
289
+        );
290
+      }
291
+      return <TreeNode key={item.key} {...item} />;
292
+    });
293
+
294
+
295
+
296
+  render() {
297
+    return (
298
+     <Card>
299
+      <Row>
238 300
         <Col xs={{ span: 5, offset: 1 }} lg={{ span: 6, offset: 0 }}>
239 301
           <Card>
240
-            <Button type='danger' style={{ marginLeft: '2em' }} >
241
-              删除
242
-            </Button>
243
-            <DirectoryTree >
244
-              <TreeNode title="厂长管理" key="0-0">
245
-                <TreeNode  title="刘张" value='刘帐' key="0-0-0" isLeaf />
246
-                <TreeNode title="李徐" key="0-0-1" isLeaf />
247
-              </TreeNode>
248
-              <TreeNode title="员工管理" key="0-1">
249
-                <TreeNode title="leaf 1-0" key="0-1-0" isLeaf />
250
-                <TreeNode title="leaf 1-1" key="0-1-1" isLeaf />
251
-                <TreeNode title="leaf 1-1" key="0-1-2" isLeaf />
252
-                <TreeNode title="leaf 1-1" key="0-1-3" isLeaf />
253
-                <TreeNode title="leaf 1-1" key="0-1-4" isLeaf />
254
-                <TreeNode title="leaf 1-1" key="0-1-5" isLeaf />
255
-              </TreeNode>
256
-            </DirectoryTree>
302
+              <Tree 
303
+                // checkable
304
+                showLine={true}
305
+                onExpand={this.onExpand}
306
+                expandedKeys={this.state.expandedKeys}
307
+                autoExpandParent={this.state.autoExpandParent}
308
+                onCheck={this.onCheck}
309
+                checkedKeys={this.state.checkedKeys}
310
+                onSelect={this.onSelect}
311
+                selectedKeys={this.state.selectedKeys}
312
+              >
313
+                {this.renderTreeNodes(treeData)}
314
+              </Tree >
257 315
           </Card>
258 316
         </Col>
259
-        {/* FFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFF>Form表单 */}
260 317
         <Col xs={{ span: 10, offset: 10 }} lg={{ span: 10, offset: 4 }}>
261 318
           <Card>
262
-            
319
+          <TreedataFrom />
263 320
           </Card>
264 321
         </Col>
265 322
       </Row>
266
-    </Card>
267
-
268
-  )
269
-})
270
-
323
+     </Card> 
324
+    );
325
+  }
326
+}
271 327
 
272
-export default Form.create({})(userTree);
328
+export default Demo 

+ 110
- 18
src/pages/staff/Organization/tree.jsx View File

@@ -1,18 +1,110 @@
1
-import { Tree } from 'antd'
2
-
3
-export default (props) => {
4
-    const { TreeNode, DirectoryTree } = Tree
5
-
6
-    return (
7
-        <DirectoryTree multiple>
8
-            <TreeNode title="parent 0" key="0-0">
9
-                <TreeNode title="leaf 0-0" key="0-0-0" isLeaf />
10
-                <TreeNode title="leaf 0-1" key="0-0-1" isLeaf />
11
-            </TreeNode>
12
-            <TreeNode title="parent 1" key="0-1">
13
-                <TreeNode title="leaf 1-0" key="0-1-0" isLeaf />
14
-                <TreeNode title="leaf 1-1" key="0-1-1" isLeaf />
15
-            </TreeNode>
16
-        </DirectoryTree>
17
-    )
18
-}
1
+
2
+
3
+
4
+// import { Tree } from 'antd';
5
+
6
+// const { TreeNode } = Tree;
7
+
8
+// const treeData = [
9
+//   {
10
+//     title: '0-0',
11
+//     key: '0-0',
12
+//     children: [
13
+//       {
14
+//         title: '0-0-0',
15
+//         key: '0-0-0',
16
+//         children: [
17
+//           { title: '0-0-0-0', key: '0-0-0-0' },
18
+//           { title: '0-0-0-1', key: '0-0-0-1' },
19
+//           { title: '0-0-0-2', key: '0-0-0-2' },
20
+//         ],
21
+//       },
22
+//       {
23
+//         title: '0-0-1',
24
+//         key: '0-0-1',
25
+//         children: [
26
+//           { title: '0-0-1-0', key: '0-0-1-0' },
27
+//           { title: '0-0-1-1', key: '0-0-1-1' },
28
+//           { title: '0-0-1-2', key: '0-0-1-2' },
29
+//         ],
30
+//       },
31
+//       {
32
+//         title: '0-0-2',
33
+//         key: '0-0-2',
34
+//       },
35
+//     ],
36
+//   },
37
+//   {
38
+//     title: '0-1',
39
+//     key: '0-1',
40
+//     children: [
41
+//       { title: '0-1-0-0', key: '0-1-0-0' },
42
+//       { title: '0-1-0-1', key: '0-1-0-1' },
43
+//       { title: '0-1-0-2', key: '0-1-0-2' },
44
+//     ],
45
+//   },
46
+//   {
47
+//     title: '0-2',
48
+//     key: '0-2',
49
+//   },
50
+// ];
51
+
52
+// class Demo extends React.Component {
53
+//   state = {
54
+//     expandedKeys: ['0-0-0', '0-0-1'],
55
+//     autoExpandParent: true,
56
+//     checkedKeys: ['0-0-0'],
57
+//     selectedKeys: [],
58
+//   };
59
+
60
+//   onExpand = expandedKeys => {
61
+//     console.log('onExpand', expandedKeys);
62
+//     // if not set autoExpandParent to false, if children expanded, parent can not collapse.
63
+//     // or, you can remove all expanded children keys.
64
+//     this.setState({
65
+//       expandedKeys,
66
+//       autoExpandParent: false,
67
+//     });
68
+//   };
69
+
70
+//   onCheck = checkedKeys => {
71
+//     console.log('onCheck', checkedKeys);
72
+//     this.setState({ checkedKeys });
73
+//   };
74
+
75
+//   onSelect = (selectedKeys, info) => {
76
+//     console.log('onSelect', info);
77
+//     this.setState({ selectedKeys });
78
+//   };
79
+
80
+//   renderTreeNodes = data =>
81
+//     data.map(item => {
82
+//       if (item.children) {
83
+//         return (
84
+//           <TreeNode title={item.title} key={item.key} dataRef={item}>
85
+//             {this.renderTreeNodes(item.children)}
86
+//           </TreeNode>
87
+//         );
88
+//       }
89
+//       return <TreeNode key={item.key} {...item} />;
90
+//     });
91
+
92
+//   render() {
93
+//     return (
94
+//       <Tree
95
+//         checkable
96
+//         onExpand={this.onExpand}
97
+//         expandedKeys={this.state.expandedKeys}
98
+//         autoExpandParent={this.state.autoExpandParent}
99
+//         onCheck={this.onCheck}
100
+//         checkedKeys={this.state.checkedKeys}
101
+//         onSelect={this.onSelect}
102
+//         selectedKeys={this.state.selectedKeys}
103
+//       >
104
+//         {this.renderTreeNodes(treeData)}
105
+//       </Tree>
106
+//     );
107
+//   }
108
+// }
109
+
110
+// export default Demo