|
@@ -1,23 +1,28 @@
|
|
|
import {Button, Card, Form, Input, message} from 'antd';
|
|
|
-import React from 'react';
|
|
|
+import React, {useState} from 'react';
|
|
|
import {PageHeaderWrapper} from '@ant-design/pro-layout';
|
|
|
import service from './service';
|
|
|
|
|
|
-interface PasswordChange{
|
|
|
+interface PasswordChange {
|
|
|
newPassword: string;
|
|
|
oldPassword: string;
|
|
|
}
|
|
|
|
|
|
+enum InputState {
|
|
|
+ default = '',
|
|
|
+ success = 'success',
|
|
|
+ error = 'error'
|
|
|
+}
|
|
|
+
|
|
|
const layout = {
|
|
|
- labelCol: { span: 4 },
|
|
|
- wrapperCol: { span: 18 },
|
|
|
+ labelCol: {span: 4},
|
|
|
+ wrapperCol: {span: 18},
|
|
|
};
|
|
|
const tailLayout = {
|
|
|
- wrapperCol: { offset: 4, span: 18 },
|
|
|
+ wrapperCol: {offset: 4, span: 18},
|
|
|
};
|
|
|
|
|
|
|
|
|
-
|
|
|
/**
|
|
|
* 更新节点
|
|
|
* @param fields
|
|
@@ -32,15 +37,50 @@ const handleUpdate = async (fields: PasswordChange) => {
|
|
|
} else {
|
|
|
message.error('修改失败!');
|
|
|
}
|
|
|
- }catch (e) {
|
|
|
+ } catch (e) {
|
|
|
console.log(e);
|
|
|
}
|
|
|
};
|
|
|
|
|
|
+
|
|
|
+
|
|
|
const TableList: React.FC<{}> = () => {
|
|
|
+ const [success, setSuccess] = useState<InputState>(InputState.default);
|
|
|
+
|
|
|
+ const [form2] = Form.useForm();
|
|
|
+
|
|
|
+ const nameExist = async () => {
|
|
|
+ const res = await service.nameExist({userName: form2.getFieldValue("userName")});
|
|
|
+ if (res.success) {
|
|
|
+ setSuccess(InputState.success);
|
|
|
+ return true;
|
|
|
+ } else {
|
|
|
+ setSuccess(InputState.error);
|
|
|
+ }
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 密码更新
|
|
|
+ * @param values
|
|
|
+ */
|
|
|
const onFinish = (values: any) => {
|
|
|
handleUpdate(values);
|
|
|
};
|
|
|
+ /**
|
|
|
+ * 用户名更新
|
|
|
+ * @param value
|
|
|
+ */
|
|
|
+ const onFinishUserName = async (value: any) => {
|
|
|
+ const res = await service.updateAccountName(value);
|
|
|
+ if (res.success) {
|
|
|
+ message.success('修改成功');
|
|
|
+ history.go(0);
|
|
|
+ } else {
|
|
|
+ message.error('修改失败!');
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
// const onFinishFailed = errorInfo => {
|
|
|
// console.log('Failed:', errorInfo);
|
|
@@ -48,28 +88,59 @@ const TableList: React.FC<{}> = () => {
|
|
|
|
|
|
return (
|
|
|
<PageHeaderWrapper title={false}>
|
|
|
- <Card title="重置密码" style={{ width: '100%' }}>
|
|
|
+
|
|
|
+ <Card title="修改用户名" style={{width: '100%'}}>
|
|
|
+ <Form
|
|
|
+ {...layout}
|
|
|
+ name="basic"
|
|
|
+ form={form2}
|
|
|
+ initialValues={{remember: true}}
|
|
|
+ onFinish={onFinishUserName}
|
|
|
+ // onFinishFailed={onFinishFailed}
|
|
|
+ >
|
|
|
+ <Form.Item
|
|
|
+ label="新用户名"
|
|
|
+ name="userName"
|
|
|
+ hasFeedback
|
|
|
+ validateStatus={success}
|
|
|
+ >
|
|
|
+ <Input />
|
|
|
+ </Form.Item>
|
|
|
+
|
|
|
+ <Form.Item {...tailLayout}>
|
|
|
+ <Button type="primary" htmlType="button" onClick={nameExist}>
|
|
|
+ 校验
|
|
|
+ </Button>
|
|
|
+ <span> </span>
|
|
|
+ <Button type="primary" htmlType="submit">
|
|
|
+ 提交
|
|
|
+ </Button>
|
|
|
+ </Form.Item>
|
|
|
+ </Form>
|
|
|
+ </Card>
|
|
|
+
|
|
|
+ <Card title="重置密码" style={{width: '100%'}}>
|
|
|
<Form
|
|
|
{...layout}
|
|
|
name="basic"
|
|
|
- initialValues={{ remember: true }}
|
|
|
+ initialValues={{remember: true}}
|
|
|
onFinish={onFinish}
|
|
|
// onFinishFailed={onFinishFailed}
|
|
|
>
|
|
|
<Form.Item
|
|
|
label="旧密码"
|
|
|
name="oldPassword"
|
|
|
- rules={[{ required: true, message: '请输入旧密码!' }]}
|
|
|
+ rules={[{required: true, message: '请输入旧密码!'}]}
|
|
|
>
|
|
|
- <Input.Password />
|
|
|
+ <Input.Password/>
|
|
|
</Form.Item>
|
|
|
|
|
|
<Form.Item
|
|
|
label="新密码"
|
|
|
name="newPassword"
|
|
|
- rules={[{ required: true, message: '请输入旧密码' }]}
|
|
|
+ rules={[{required: true, message: '请输入旧密码'}]}
|
|
|
>
|
|
|
- <Input.Password />
|
|
|
+ <Input.Password/>
|
|
|
</Form.Item>
|
|
|
|
|
|
<Form.Item {...tailLayout}>
|