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;
|
|
