frontend-recharge-system/src/pages/Login/index.tsx

106 lines
3.3 KiB
TypeScript

import { LeftSquareFilled, LockOutlined, UserOutlined } from '@ant-design/icons';
import React, { useState } from 'react';
import { ProFormText, LoginForm } from '@ant-design/pro-form';
import { useIntl, history, FormattedMessage, useModel } from 'umi';
import { login } from '@/services/login';
import defaultSettings from '../../../config/defaultSettings';
import styles from './index.less';
import { CACHE_TOKEN } from '@/constants/cacheKey';
import { initWeb3, walletSign } from '../../utils/web3';
import { Button } from 'antd';
const Login: React.FC = () => {
const intl = useIntl();
const handleSubmit = async () => {
// 登录
await initWeb3();
const signInfo = await walletSign();
const res: any = await login({ data: signInfo.raw, sign: signInfo.sign });
localStorage.setItem(CACHE_TOKEN, res);
// const res: any = await login({ ...values });
// localStorage.setItem(CACHE_TOKEN, res.token);
/** 此方法会跳转到 redirect 参数所在的位置 */
if (!history) return;
const { query } = history.location;
const { redirect } = query as { redirect: string };
history.push(redirect || '/');
};
const handleQRCodeSubmit = async () => {};
return (
<div className={styles.container}>
<div className={styles.content}>
<Button size={'large'} type="primary" block onClick={handleSubmit}>
</Button>
<Button
className={styles.button}
size={'large'}
type="primary"
block
onClick={handleQRCodeSubmit}
>
</Button>
{/* <LoginForm
logo={<img alt="logo" src="/logo.svg" />}
title={defaultSettings.title as string}
initialValues={{
autoLogin: true,
}}
onFinish={async (values) => {
await handleSubmit(values as API.LoginParams);
}}
>
<ProFormText
name="username"
fieldProps={{
size: 'large',
prefix: <UserOutlined className={styles.prefixIcon} />,
}}
placeholder={intl.formatMessage({
id: 'pages.login.username.placeholder',
defaultMessage: '用户名',
})}
rules={[
{
required: true,
message: (
<FormattedMessage
id="pages.login.username.required"
defaultMessage="请输入用户名!"
/>
),
},
]}
/>
<ProFormText.Password
name="password"
fieldProps={{
size: 'large',
prefix: <LockOutlined className={styles.prefixIcon} />,
}}
placeholder={intl.formatMessage({
id: 'pages.login.password.placeholder',
defaultMessage: '密码',
})}
rules={[
{
required: true,
message: (
<FormattedMessage
id="pages.login.password.required"
defaultMessage="请输入密码!"
/>
),
},
]}
/>
</LoginForm> */}
</div>
</div>
);
};
export default Login;