|  |  | 
 |  |  | import React, { useState, useRef, useEffect } from 'react'; | 
 |  |  | import { | 
 |  |  |     ProForm, | 
 |  |  |     ProFormDigit, | 
 |  |  |     ProFormText, | 
 |  |  | } from '@ant-design/pro-components'; | 
 |  |  | import { Form, Modal } from 'antd'; | 
 |  |  |  | 
 |  |  | const Pwd = (props) => { | 
 |  |  |     const [form] = Form.useForm(); | 
 |  |  |     const { } = props; | 
 |  |  |  | 
 |  |  |     delete props.values.password | 
 |  |  |  | 
 |  |  |     useEffect(() => { | 
 |  |  |         form.resetFields(); | 
 |  |  |         form.setFieldsValue({ | 
 |  |  |             ...props.values | 
 |  |  |         }) | 
 |  |  |     }, [form, props]) | 
 |  |  |  | 
 |  |  |     const handleCancel = () => { | 
 |  |  |         props.onCancel(); | 
 |  |  |     }; | 
 |  |  |  | 
 |  |  |     const handleOk = () => { | 
 |  |  |         form.submit(); | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     const handleFinish = async (values) => { | 
 |  |  |         props.onSubmit({ ...values }); | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     return ( | 
 |  |  |         <> | 
 |  |  |             <Modal | 
 |  |  |                 title="Reset Password" | 
 |  |  |                 width={400} | 
 |  |  |                 forceRender | 
 |  |  |                 destroyOnClose | 
 |  |  |                 open={props.open} | 
 |  |  |                 onCancel={handleCancel} | 
 |  |  |                 onOk={handleOk} | 
 |  |  |             > | 
 |  |  |                 <ProForm | 
 |  |  |                     form={form} | 
 |  |  |                     submitter={false} | 
 |  |  |                     onFinish={handleFinish} | 
 |  |  |                     layout="horizontal" | 
 |  |  |                     grid={true} | 
 |  |  |                 > | 
 |  |  |                     <ProFormDigit | 
 |  |  |                         name="id" | 
 |  |  |                         disabled | 
 |  |  |                         hidden={true} | 
 |  |  |                     /> | 
 |  |  |                     <ProFormText | 
 |  |  |                         name="password" | 
 |  |  |                         label="新密码" | 
 |  |  |                         colProps={{ md: 24, xl: 24 }} | 
 |  |  |                         placeholder="请输入" | 
 |  |  |                         rules={[ | 
 |  |  |                             { required: true, message: "密码不能为空!" }, | 
 |  |  |                             { min: 4, message: "密码不能小于4位! " }, | 
 |  |  |                             { max: 16, message: "密码不能大于16位! " }, | 
 |  |  |                         ]} | 
 |  |  |                     /> | 
 |  |  |                 </ProForm> | 
 |  |  |             </Modal> | 
 |  |  |         </> | 
 |  |  |     ) | 
 |  |  | } | 
 |  |  |  | 
 |  |  | export default Pwd; | 
 |  |  | import React, { useState, useRef, useEffect } from 'react';
 | 
 |  |  | import {
 | 
 |  |  |     ProForm,
 | 
 |  |  |     ProFormDigit,
 | 
 |  |  |     ProFormText,
 | 
 |  |  | } from '@ant-design/pro-components';
 | 
 |  |  | import { FormattedMessage, useIntl } from '@umijs/max';
 | 
 |  |  | import { Form, Modal } from 'antd';
 | 
 |  |  | 
 | 
 |  |  | const Pwd = (props) => {
 | 
 |  |  |     const intl = useIntl();
 | 
 |  |  |     const [form] = Form.useForm();
 | 
 |  |  |     const { } = props;
 | 
 |  |  | 
 | 
 |  |  |     delete props.values.password
 | 
 |  |  | 
 | 
 |  |  |     useEffect(() => {
 | 
 |  |  |         form.resetFields();
 | 
 |  |  |         form.setFieldsValue({
 | 
 |  |  |             ...props.values
 | 
 |  |  |         })
 | 
 |  |  |     }, [form, props])
 | 
 |  |  | 
 | 
 |  |  |     const handleCancel = () => {
 | 
 |  |  |         props.onCancel();
 | 
 |  |  |     };
 | 
 |  |  | 
 | 
 |  |  |     const handleOk = () => {
 | 
 |  |  |         form.submit();
 | 
 |  |  |     }
 | 
 |  |  | 
 | 
 |  |  |     const handleFinish = async (values) => {
 | 
 |  |  |         props.onSubmit({ ...values });
 | 
 |  |  |     }
 | 
 |  |  | 
 | 
 |  |  |     return (
 | 
 |  |  |         <>
 | 
 |  |  |             <Modal
 | 
 |  |  |                 title={intl.formatMessage({ id: 'page.reset.pwd', defaultMessage: '重置密码' })}
 | 
 |  |  |                 width={400}
 | 
 |  |  |                 forceRender
 | 
 |  |  |                 destroyOnClose
 | 
 |  |  |                 open={props.open}
 | 
 |  |  |                 onCancel={handleCancel}
 | 
 |  |  |                 onOk={handleOk}
 | 
 |  |  |             >
 | 
 |  |  |                 <ProForm
 | 
 |  |  |                     form={form}
 | 
 |  |  |                     submitter={false}
 | 
 |  |  |                     onFinish={handleFinish}
 | 
 |  |  |                     layout="horizontal"
 | 
 |  |  |                     grid={true}
 | 
 |  |  |                 >
 | 
 |  |  |                     <ProFormDigit
 | 
 |  |  |                         name="id"
 | 
 |  |  |                         disabled
 | 
 |  |  |                         hidden={true}
 | 
 |  |  |                     />
 | 
 |  |  |                     <ProFormText
 | 
 |  |  |                         name="password"
 | 
 |  |  |                         label={intl.formatMessage({ id: 'personal.security.new.pwd', defaultMessage: '新密码' })}
 | 
 |  |  |                         colProps={{ md: 24, xl: 24 }}
 | 
 |  |  |                         placeholder="请输入"
 | 
 |  |  |                         rules={[
 | 
 |  |  |                             { required: true, message: "密码不能为空!" },
 | 
 |  |  |                             { min: 4, message: "密码不能小于4位! " },
 | 
 |  |  |                             { max: 16, message: "密码不能大于16位! " },
 | 
 |  |  |                         ]}
 | 
 |  |  |                     />
 | 
 |  |  |                 </ProForm>
 | 
 |  |  |             </Modal>
 | 
 |  |  |         </>
 | 
 |  |  |     )
 | 
 |  |  | }
 | 
 |  |  | 
 | 
 |  |  | export default Pwd;
 |