baozhangchao 3 年之前
父節點
當前提交
0ab73eaa30
共有 2 個檔案被更改,包括 142 行新增154 行删除
  1. 72
    140
      src/pages/staff/Organization/form.jsx
  2. 70
    14
      src/pages/staff/Organization/index.jsx

+ 72
- 140
src/pages/staff/Organization/form.jsx 查看文件

@@ -1,130 +1,12 @@
1
-// // import React from 'react'
2
-// import { Row, Col, Card, Tree, DatePicker, Radio,Form, Select, Input,InputNumber, Button } from 'antd';
3
-// import React, { useEffect, useState, useCallback } from 'react';
4
-
5
-
6
-// import ImageUpload from '@/components/XForm/ImageUpload';
7
-// const FormItem = Form.Item;
8
-// const {RangePicker}=DatePicker
9
-// const [loading, setLoading] = useState(false);
10
-
11
-// const formItemLayout = {
12
-//     labelCol: { span: 6 },
13
-//     wrapperCol: { span: 14 },
14
-// };
15
-
16
-// class TreedataFrom extends React.Component {
17
-  
18
-//   handleSubmit = e => {
19
-//     e.preventDefault();
20
-//     this.props.form.validateFields((err, values) => {
21
-//       if (!err) {
22
-//         return;
23
-//       }
24
-//       setLoading(true);
25
-
26
-//       if (eventKey) {
27
-//         //如果有这个id拿。没有就,拿返回的curriculumId
28
-//         updateCurriculumData({
29
-//           data: {
30
-//             ...values,
31
-//             eventKey
32
-//           },
33
-//           urlData: { id: eventKey }
34
-//         }).then(() => {
35
-//           setLoading(false);
36
-//           message.success('数据更新成功');
37
-//           goBack()
38
-//         }).catch((err) => {
39
-//           setLoading(false);//loading消失
40
-//           message.error(err.message || err);
41
-//         })
42
-//       } else {
43
-//         saveCurriculumData({ data: values }).then(() => {
44
-//           setLoading(false);
45
-//           message.success('数据保存成功');
46
-//           goBack()
47
-//         }).catch((err) => {
48
-//           setLoading(false);//loading消失
49
-//           message.error(err.message || err);
50
-//         })
51
-//       }
52
-
53
-//     });
54
-//   };
55
-
56
-//   render() {
57
-//     const { form,getFieldDecorator } = this.props.form;
58
-//     return (
59
-//       <Form {...formItemLayout} onSubmit={this.handleSubmit} >
60
-//         <FormItem label="照片" help="建议尺寸:750px*600px,比例5:4,格式:jpg,用于:列表和详情">
61
-//           {
62
-//             getFieldDecorator('curriculumImg', {
63
-//               rules: [
64
-//                 { required: true, message: '请上传照片' }
65
-//               ]
66
-//             })(
67
-//               <ImageUpload />
68
-//             )
69
-//           }
70
-//         </FormItem>
71
-//         <FormItem label="姓名">
72
-//           {getFieldDecorator('note', {
73
-//             rules: [{ required: true, message: '请输入姓名!' }],
74
-//           })(<Input style={{width:"200px"}} />)}
75
-//         </FormItem>
76
-//         <FormItem label="年龄" >
77
-//            {
78
-//             getFieldDecorator('weight', {
79
-//               rules: [{ required: true, message: '请输入年龄' }]
80
-//             })(
81
-//               <InputNumber min='18' />
82
-//             )
83
-//           }
84
-//         </FormItem>
85
-//         <FormItem label="性别">
86
-//           {
87
-//             getFieldDecorator('type', {
88
-//               rules: [
89
-//                 { required: true, message: '请选择性别' }
90
-//               ]
91
-//             })(
92
-//               <Radio.Group  style={{ width: '500px' }} initialValue={1}>
93
-//                 {/* onChange={e => setContentType(e.target.value)} */}
94
-//                 <Radio value={1}>男</Radio>
95
-//                 <Radio value={2}>女</Radio>
96
-//               </Radio.Group>
97
-//             )
98
-//           }
99
-//         </FormItem>
100
-//         <FormItem label="工作总时间" style={{ marginBottom: 0 }} help="如未离职,结束日期和开始日期一样即可">
101
-//           <FormItem style={{ display: 'inline-block' }} >
102
-//             <RangePicker style={{width: '255px'}}/>
103
-//           </FormItem>
104
-//         </FormItem>
105
-//         <FormItem wrapperCol={{ span: 12, offset: 5 }}>
106
-//           <Button type="primary" htmlType="submit">
107
-//             Submit
108
-//           </Button>
109
-//         </FormItem>
110
-//       </Form>
111
-//     );
112
-//   }
113
-// }
114
-
115
-// export default Form.create({})(TreedataFrom);
116
-
117
-
118
-//  TreedataFrom = Form.create({})(TreedataFrom);
119
-//  export default TreedataFrom 
120 1
 
121 2
 
122 3
 import React, { useEffect, useState, useCallback } from 'react';
123 4
 import { Button, Form, Select, Input, InputNumber, Radio, message, Card,DatePicker, } from 'antd';
124 5
 import ImageUpload from '@/components/XForm/ImageUpload';
6
+import { values } from 'lodash';
125 7
 const FormItem = Form.Item;
126 8
 const {RangePicker}=DatePicker
127
-
9
+const { Option } = Select;
128 10
 const TreedataFrom = React.forwardRef((props, ref) => {
129 11
   const [treeData, setTreeData] = useState();
130 12
   const [data, setData] = useState(treeData);
@@ -144,6 +26,10 @@ const TreedataFrom = React.forwardRef((props, ref) => {
144 26
   }
145 27
 
146 28
 
29
+
30
+ const handleChange=(value)=> {
31
+    console.log(`selected ${value}`);
32
+  }
147 33
   const handleSubmit = (e) => {
148 34
     e.preventDefault();
149 35
     validateFields((err, values) => {
@@ -156,29 +42,19 @@ const TreedataFrom = React.forwardRef((props, ref) => {
156 42
 
157 43
 
158 44
   return (
159
-    <Form {...formItemLayout}  ref={formRef} onSubmit={handleSubmit} >
160
-         <FormItem label="照片" help="建议尺寸:750px*600px,比例5:4,格式:jpg,用于:列表和详情">
161
-               {
162
-                getFieldDecorator('curriculumImg', {
163
-                  rules: [
164
-                    { required: true, message: '请上传照片' }
165
-                  ]
166
-                })(
167
-                  <ImageUpload />
168
-                )
169
-              }
170
-            </FormItem>
45
+
46
+    <Form {...formItemLayout}  ref={formRef}  onChange={onChange}   onSubmit={handleSubmit} >
171 47
             <FormItem label="姓名">
172 48
               {getFieldDecorator('name', {
173 49
                 rules: [{ required: true, message: '请输入姓名!' }],
174
-              })(<Input style={{width:"200px"}} />)}
50
+              })(<Input/>)}
175 51
             </FormItem>
176
-            <FormItem label="年龄" >
52
+            <FormItem label="身份证号" >
177 53
                {
178
-                getFieldDecorator('age', {
179
-                  rules: [{ required: true, message: '请输入年龄' }]
54
+                getFieldDecorator('cardId', {
55
+                  rules: [{ required: true, message: '请输入身份证号' }]
180 56
                 })(
181
-                  <InputNumber min={18}  />
57
+                  <Input maxLength={19} />
182 58
                 )
183 59
               }
184 60
             </FormItem>
@@ -190,18 +66,74 @@ const TreedataFrom = React.forwardRef((props, ref) => {
190 66
                   ]
191 67
                 })(
192 68
                   <Radio.Group  style={{ width: '500px' }} initialValue={1}>
193
-                    {/* onChange={e => setContentType(e.target.value)} */}
194 69
                     <Radio value={1}>男</Radio>
195 70
                     <Radio value={2}>女</Radio>
196 71
                   </Radio.Group>
197 72
                 )
198 73
               }
199 74
             </FormItem>
200
-            <FormItem label="工作总时间" style={{ marginBottom: 0 }} >
75
+            <FormItem label="联系方式" >
76
+               {
77
+                getFieldDecorator('phone', {
78
+                  rules: [{ required: true, message: '请输入联系方式' }]
79
+                })(
80
+                  <Input  maxLength={11}/>
81
+                )
82
+              }
83
+            </FormItem>
84
+            <FormItem label="员工卡号" >
85
+               {
86
+                getFieldDecorator('id', {
87
+                  rules: [{ required: true, message: '请输入员工卡号' }]
88
+                })(
89
+                  <Input />
90
+                )
91
+              }
92
+            </FormItem>
93
+            <FormItem label="归属部门" >
94
+               {
95
+                getFieldDecorator('belon', {
96
+                  rules: [{ required: true, message: '请选择归属部门' }]
97
+                })(
98
+                  <Select initialValue={1}  onChange={handleChange}>
99
+                  <Option value={1}>财务部</Option>
100
+                  <Option value={2}>宣传部</Option>
101
+                  <Option value={3}>研发部</Option>
102
+                  <Option value={4}>仓储物流部</Option>
103
+                </Select>
104
+                )
105
+              }
106
+            </FormItem>
107
+            <FormItem label="居住所在地" >
108
+               {
109
+                getFieldDecorator('homeaddres', {
110
+                  rules: [{ required: true, message: '请选择所在地' }]
111
+                })(
112
+                  <Select initialValue={1}  onChange={handleChange}>
113
+                  <Option value={1}>南京</Option>
114
+                  <Option value={2}>北京</Option>
115
+                  <Option value={3}>湖北</Option>
116
+                  <Option value={4}>湖南</Option>
117
+                  <Option value={5}>上海</Option>
118
+                  <Option value={6}>四川</Option>
119
+                </Select>
120
+                )
121
+              }
122
+            </FormItem>
123
+            <FormItem label="备注" >
124
+               {
125
+                getFieldDecorator('remark', {
126
+                  rules: [{ required: false, message: '请输入备注' }]
127
+                })(
128
+                  <Input />
129
+                )
130
+              }
131
+            </FormItem>
132
+            <FormItem label="出生日期" style={{ marginBottom: 0 }} >
201 133
               {
202 134
                 getFieldDecorator('day', {
203 135
                   rules: [
204
-                    { required: true, message: '请选择日期' }
136
+                    { required: true, message: '请选择出生日期' }
205 137
                   ]
206 138
                 })(
207 139
                 // <RangePicker style={{width: '255px'}} />

+ 70
- 14
src/pages/staff/Organization/index.jsx 查看文件

@@ -211,7 +211,7 @@
211 211
 
212 212
 
213 213
 
214
-import { Row, Col, Card, Tree, Form, TreeSelect, Input, InputNumber, Radio, Button } from 'antd'
214
+import { Row, Col, Card, Tree, Form, TreeSelect, Input, InputNumber, Modal, Button, message } from 'antd'
215 215
 import { title } from 'echarts/lib/theme/dark';
216 216
 import React, { useEffect, useState, useCallback,useRef } from 'react';
217 217
 import TreedataFrom from './form';
@@ -219,16 +219,52 @@ import TreedataFrom from './form';
219 219
 const { TreeNode,DirectoryTree } = Tree;
220 220
 const FormItem = Form.Item;
221 221
 
222
-
222
+//-----------------------------------
223 223
   const onAdd = (key) => {
224 224
     if (expandedKeys.indexOf(key) === -1) {
225 225
       expandedKeyArr.push(key);
226 226
     }
227
-    setExpandedKeys(expandedKeyArr.slice());
227
+    expandedKeys(expandedKeyArr.slice());
228 228
     addNode(key, treeData);//添加节点 树形
229
-    //useState里数据务必为immutable (不可赋值的对象),所以必须加上slice()返回一个新的数组对象
230 229
     setData(treeData.slice());//添加子项
231 230
   };
231
+//-----------------------------------
232
+const confirm = data => {
233
+  // {...data,isPublish}
234
+    if (data.key !== 0) {
235
+      Modal.confirm({
236
+        title: '确认删除吗?',
237
+        okText: '确认',
238
+        cancelText: '取消',
239
+        onOk() {
240
+          message.error('失败');
241
+
242
+        },
243
+      });
244
+    }else{
245
+      message.error('error')
246
+    }
247
+}
248
+
249
+
250
+
251
+
252
+
253
+
254
+
255
+// function uuid() {
256
+//   var s = [];
257
+//   var hexDigits = "0123456789";
258
+//   for (var i = 0; i < 18; i++) {
259
+//       s[i] = hexDigits.substr(Math.floor(Math.random() * 1*10), 1);
260
+//   }
261
+
262
+//   var uuid = s.join("");
263
+//   return uuid;
264
+// }
265
+
266
+
267
+
232 268
 // const [treeData, settreeData] = useState([])
233 269
 
234 270
 const treeData = [
@@ -236,17 +272,17 @@ const treeData = [
236 272
     title: '分厂厂长管理',
237 273
     key: '0',
238 274
     children: [
239
-        { title: '刘厂长',age:48, sex:1, key: '0-0-0-1' },
240
-        { title: '王副厂长', age:28, sex:1,key: '0-0-0-2' ,},
275
+        { title: '郎岩',phone:'15920583224', cardId:'511502199103223189',sex:1,id:'0212',belon:1,homeaddres:1, key: '0-0-0-1' },
276
+        { title: '柯琼彦',phone:'13184013427', cardId:'210203197503102721', sex:2 ,id:'4242',belon:2,homeaddres:2, key: '0-0-0-2' ,},
241 277
     ],
242 278
   },
243 279
   {
244 280
       title: '分厂员工管理',
245 281
       key: '0-0-1',
246 282
       children: [
247
-        { title: '小王', age:20, sex:1,key: '0-0-1-0' },
248
-        { title: '小刘', age:23, sex:1,key: '0-0-1-1' },
249
-        { title: '小罗',age:34, sex:1, key: '0-0-1-2' },
283
+        { title: '伏佳', phone:'18613523527', cardId:'520323197806058856',sex:1  ,id:'1124', belon:4,homeaddres:4,key: '0-0-1-0' },
284
+        { title: '舒宏', phone:'14736632088', cardId:'610729197408202551', sex:1 ,id:'4534', belon:3,homeaddres:2,key: '0-0-1-1' },
285
+        { title: '狄莉珍',phone:'17604898508', cardId:'820000195008115837', sex:1 ,id:'4242',belon:1,homeaddres:5,  key: '0-0-1-2' },
250 286
       ],
251 287
   },
252 288
 ];
@@ -262,7 +298,8 @@ class TreeDemo extends React.Component {
262 298
       autoExpandParent: false,
263 299
       checkedKeys: ['0-0-0'],
264 300
       selectedKeys: [],
265
-      treeTitle:[this.treeTitle]
301
+      treeTitle:[this.treeTitle],
302
+      checked:true
266 303
       
267 304
     };
268 305
   }
@@ -279,17 +316,35 @@ class TreeDemo extends React.Component {
279 316
     });
280 317
   };
281 318
 
319
+  handelSex = e => {
320
+    this.setState({
321
+      sex: e.target.value
322
+    });
323
+    console.log(valeu);
324
+  };
282 325
 
283 326
 onSelect=(value,info)=>{
284 327
   this.setState({value},()=>{
285 328
     this.formRef.current.setFieldsValue({
286 329
       name:info.node.props.title,
287
-      age:info.node.props.age,
288
-
330
+      cardId:info.node.props.cardId,
331
+      id:info.node.props.id,
332
+      phone:info.node.props.phone,
333
+      sex:info.node.props.sex,
334
+      belon:info.node.props.belon,
335
+      homeaddres:info.node.props.homeaddres,
289 336
     })
337
+  console.log(this.state.treeTitle);
338
+
290 339
   })
291 340
 }
341
+//   if(info.node.props.sex===0){
342
+//     this.state.checked=true
343
+//   }else{
344
+//     this.state.checked=false
345
+//   }
292 346
 
347
+//   console.log(this.state.checked);
293 348
 
294 349
 
295 350
 
@@ -320,10 +375,10 @@ onSelect=(value,info)=>{
320 375
               <FormItem
321 376
               label="管辖部门"
322 377
             >
323
-              <Button type="primary" style={{marginRight:'20px'}} onClick={()=>onAdd} >
378
+              <Button type="primary" style={{marginRight:'20px'}} onClick={onAdd} >
324 379
                 增加
325 380
               </Button>
326
-              <Button type="danger">
381
+              <Button type="danger" onClick={confirm}>
327 382
                 删除
328 383
               </Button> 
329 384
                <Tree 
@@ -355,6 +410,7 @@ onSelect=(value,info)=>{
355 410
           <TreedataFrom 
356 411
           // treeTitle={this.state.treeTitle}
357 412
           ref={this.formRef} 
413
+          // handelSex={this.handelSex}
358 414
           // onFinish={this.state.onFinish}
359 415
 
360 416