...

liyj

2020-06-24 7af09e42b49cd18f160c19297f47c4622b1eedc3

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
import React from 'react';
import { Form, Row, Col, Input, DatePicker, Button, Modal, } from 'antd';
 
import './index.scss';
 
class ChangePswView extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
 
    };
  }
 
  onSubmitChangePsw = e => {
    this.props.form.validateFields((err, data) => {
      if (!err) {
        console.log('data', data);
        this.props.onOK({
          ...data,
        });
      }
    });
  }
 
  render() {
    const { changePswVisible, onCancel, btnLoading } = this.props;
    const { getFieldDecorator, getFieldValue } = this.props.form;
    const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 6 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 18 },
      },
    };
    const rules = [
      {
        pattern: /^[-_a-z0-9]{6,}$/i,
        message: '长度不少于6的数字字母“-”或“_”',
      },
      {
        pattern: /[-_a-z]/,
        message: '必须包含字母“-”或“_”',
      },
    ];
 
    return (
      <Modal
        destroyOnClose
        title="修改密码"
        visible={true}
        footer={null}
        onCancel={onCancel}>
        <Form onSubmit={this.onSubmitChangePsw} style={{ padding: '20px 20px 0 20px' }}>
          <Form.Item label="新密码" {...formItemLayout} >
            {getFieldDecorator('newPassWord', {
              rules: [{ required: true, message: '请输入新密码' }],
            })(<Input type="password" placeholder="请输入新密码" />)}
          </Form.Item>
          <Form.Item label="重复新密码" {...formItemLayout} >
            {getFieldDecorator('_newPword', {
              rules: [
                {
                  required: true,
                  validator(_, value, callback) {
                    if (value != getFieldValue('newPassWord')) {
                      callback('两次密码输入不一致');
                    }
                    callback();
                  },
                },
              ],
            })(
              <Input
                type="password"
                placeholder="重复新密码"
              />
            )}
          </Form.Item>
          <Form.Item>
            <Row
              type="flex"
              gutter={20}
              justify="end"
              style={{ marginTop: '20px' }}>
              <Col>
                <Button onClick={onCancel}>取消</Button>
              </Col>
              <Col>
                <Button type="primary" htmlType="submit" loding={btnLoading}>
                  确定
                </Button>
              </Col>
            </Row>
          </Form.Item>
        </Form>
      </Modal>
    );
  }
}
 
const ChangePswViewForm = Form.create()(ChangePswView);
export default ChangePswViewForm;