82 lines
3.7 KiB
TypeScript
82 lines
3.7 KiB
TypeScript
import { Box, Button, CssBaseline, Grid, Paper, TextField, ThemeProvider, Typography, Alert, Collapse } from "@mui/material"
|
|
import { useNavigate } from "react-router-dom"
|
|
import { api, theme } from '../index'
|
|
import axios from "axios"
|
|
import { useRef, useState } from "react"
|
|
import "./custom.css"
|
|
|
|
export const PageRegister = () => {
|
|
const navigate = useNavigate()
|
|
const [illegal1, setIllegal1] = useState(false)
|
|
const [illegal2, setIllegal2] = useState(false)
|
|
const [illegal3, setIllegal3] = useState(false)
|
|
|
|
//TODO
|
|
|
|
return <ThemeProvider theme={theme}>
|
|
<CssBaseline />
|
|
|
|
<div className="rootPanel">
|
|
|
|
<Box>
|
|
<Grid container direction="column" justifyContent="center" alignItems="center" spacing={1}>
|
|
<Paper elevation={3} className="inlineBox">
|
|
<Grid container direction="column" justifyContent="center" alignItems="center" spacing={2}>
|
|
<Grid item className="title">
|
|
<Typography variant="h5">
|
|
注册账户
|
|
</Typography>
|
|
|
|
</Grid>
|
|
<Grid container spacing={2}>
|
|
<Grid item><Collapse in={illegal1}>
|
|
<Alert severity="error">
|
|
无效的用户名、密码或邮箱
|
|
</Alert>
|
|
</Collapse></Grid>
|
|
|
|
<Grid item><Collapse in={illegal2}>
|
|
<Alert severity="error">
|
|
无效的邀请码
|
|
</Alert>
|
|
</Collapse></Grid>
|
|
|
|
<Grid item><Collapse in={illegal3}>
|
|
<Alert severity="error">
|
|
无效的邀请码
|
|
</Alert>
|
|
</Collapse></Grid>
|
|
</Grid>
|
|
|
|
<Grid item>
|
|
<TextField fullWidth required label="用户名" type="text" /* inputRef={usernameInput} */ onInput={() => setIllegal1(false)} />
|
|
</Grid>
|
|
|
|
<Grid item>
|
|
<TextField fullWidth required label="密码" type="password" /* inputRef={passwordInput} */ onInput={() => setIllegal1(false)} />
|
|
</Grid>
|
|
|
|
<Grid item>
|
|
<TextField fullWidth required label="邮箱" type="text" /* inputRef={emailInput} */ onInput={() => setIllegal1(false)} />
|
|
</Grid>
|
|
|
|
<Grid item>
|
|
<TextField fullWidth required label="校验码" type="text" /* inputRef={validationCodeInput} */ onInput={() => setIllegal2(false)} />
|
|
</Grid>
|
|
|
|
<Grid item>
|
|
<TextField fullWidth label="邀请码" type="text" /* inputRef={invitationCodeInput} */ onInput={() => setIllegal3(false)} />
|
|
</Grid>
|
|
|
|
<Grid item>
|
|
<Button /* onClick={handleRegister} */ variant="contained" color="primary" >
|
|
注册
|
|
</Button>
|
|
</Grid>
|
|
</Grid>
|
|
</Paper>
|
|
</Grid>
|
|
</Box>
|
|
</div>
|
|
</ThemeProvider>
|
|
} |