index.tsx
3.03 KB
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
106
107
import { RESPONSE_CODE } from '@/constants/enum';
import {
postOrderErpAuthLoginByPwd,
postOrderErpCaptchaGetImgCaptchaCode,
} from '@/services';
import { LockOutlined, UserOutlined } from '@ant-design/icons';
import {
LoginForm,
ProConfigProvider,
ProFormText,
} from '@ant-design/pro-components';
import { history, useModel } from '@umijs/max';
import { theme } from 'antd';
import { useEffect, useState } from 'react';
export default () => {
const { setUserLocalInfo } = useModel('user');
const { token } = theme.useToken();
const [code, setCode] = useState('');
const [uuid, setUuid] = useState('');
const fetchCode = async () => {
const res = await postOrderErpCaptchaGetImgCaptchaCode();
setCode(res.data.img);
setUuid(res.data.uuid);
};
useEffect(() => {
fetchCode();
}, []);
return (
<ProConfigProvider hashed={false}>
<div
style={{ backgroundColor: token.colorBgContainer }}
className="h-[100vh]"
>
<div className="flex items-center justify-center">
<LoginForm
title="订单管理"
onFinish={async (values) => {
const res = await postOrderErpAuthLoginByPwd({
data: { ...values, imgCaptchaUuid: uuid },
});
setUserLocalInfo(res.data.token, res.data?.user);
if (res.result === RESPONSE_CODE.SUCCESS) {
history.push('/order');
}
}}
>
<div className="my-8"></div>
<ProFormText
name="userName"
fieldProps={{
size: 'large',
prefix: <UserOutlined className={'prefixIcon'} />,
}}
placeholder={'用户名'}
rules={[
{
required: true,
message: '请输入用户名!',
},
]}
/>
<ProFormText.Password
name="password"
fieldProps={{
size: 'large',
prefix: <LockOutlined className={'prefixIcon'} />,
}}
placeholder={'密码'}
rules={[
{
required: true,
message: '请输入密码！',
},
]}
/>
<ProFormText
name="imgCaptchaCode"
fieldProps={{
size: 'large',
}}
placeholder={'验证码'}
rules={[
{
required: true,
message: '请输入验证码！',
},
]}
/>
<img
src={code}
className="mb-4 cursor-pointer"
onClick={() => {
fetchCode();
}}
/>
{/* <ProFormCheckbox noStyle name="autoLogin">
自动登录
</ProFormCheckbox> */}
</LoginForm>
</div>
</div>
</ProConfigProvider>
);
};