139 lines
4.1 KiB
TypeScript
139 lines
4.1 KiB
TypeScript
import * as React from 'react';
|
||
import {Button, TextField, Grid, Box,
|
||
Typography, Container
|
||
} from '@mui/material';
|
||
import Title from './title';
|
||
import Photo from './photo';
|
||
import axios from 'axios';
|
||
import student_icon from './student-icon.png';
|
||
import "./index.css";
|
||
//import useTelegram from "../hooks/useTelegram";
|
||
import Select from 'react-select';
|
||
import { useState } from 'react';
|
||
import { useConstant } from '../Constant';
|
||
|
||
|
||
const SingUpPage = (): React.ReactElement => {
|
||
const [selectedPhoto, setSelectedPhoto] = useState(null);
|
||
const [selectedOption, setSelectedOption] = useState<string | null>(null);
|
||
|
||
const handlePhotoChange = (photo) => {
|
||
setSelectedPhoto(photo);
|
||
};
|
||
|
||
const handleChange = (selectedOption) => {
|
||
setSelectedOption(selectedOption);
|
||
};
|
||
|
||
|
||
const { interests } = useConstant();
|
||
//const { user_id, username, onClose } = useTelegram();
|
||
/*
|
||
const handleSubmit = async (event) => {
|
||
event.preventDefault();
|
||
const data = new FormData(event.currentTarget);
|
||
const form = {
|
||
id: user_id,
|
||
name: username,
|
||
fullname: data.get('lname') + ' ' + data.get('fname'),
|
||
about: data.get('about'), // Новое поле "Обо мне"
|
||
photo: image,
|
||
interests: selectedOption?.map((item) => item.value)
|
||
};
|
||
await axios.post("https://sergeymorykov-tg-web-backend-1a6e.twc1.net/users_reg", form);
|
||
//await axios.post("http://localhost:5000/users_reg", form);
|
||
delete form.photo;
|
||
window.Telegram.WebApp.sendData(JSON.stringify(form));
|
||
onClose();
|
||
};
|
||
*/
|
||
|
||
return (
|
||
<Container component="main" maxWidth="xs">
|
||
<Box
|
||
sx={{
|
||
marginTop: 8,
|
||
display: 'flex',
|
||
flexDirection: 'column',
|
||
alignItems: 'center',
|
||
}}
|
||
>
|
||
<Title>Регистрация</Title>
|
||
<Box component="form" noValidate sx={{ mt: 3 }}>
|
||
<Grid container spacing={2}>
|
||
<Grid item xs={12} sm={6}>
|
||
<TextField
|
||
required
|
||
fullWidth
|
||
id="lname"
|
||
label="Фамилия"
|
||
name="lname"
|
||
autoComplete="family-name"
|
||
/>
|
||
</Grid>
|
||
<Grid item xs={12} sm={6}>
|
||
<TextField
|
||
autoComplete="given-name"
|
||
name="fname"
|
||
required
|
||
fullWidth
|
||
id="fname"
|
||
label="Имя"
|
||
autoFocus
|
||
/>
|
||
</Grid>
|
||
<Grid item xs={12}>
|
||
<TextField
|
||
fullWidth
|
||
multiline
|
||
rows={3}
|
||
id="about"
|
||
label="Обо мне"
|
||
name="about"
|
||
variant="outlined"
|
||
placeholder="Напишите о себе"
|
||
/>
|
||
</Grid>
|
||
<Grid
|
||
container
|
||
spacing={0}
|
||
direction="column"
|
||
alignItems="center"
|
||
justifyContent="center"
|
||
sx={{ paddingTop: 7, paddingLeft: 3 }}
|
||
>
|
||
<Photo defaultPhoto={student_icon} onPhotoChange={handlePhotoChange} />
|
||
</Grid>
|
||
<Grid
|
||
container
|
||
spacing={0}
|
||
direction="column"
|
||
alignItems="center"
|
||
justifyContent="center"
|
||
sx={{ paddingTop: 7, ml: 3 }}
|
||
>
|
||
<Select
|
||
onChange={handleChange}
|
||
closeMenuOnSelect={false}
|
||
isMulti
|
||
options={interests}
|
||
className="basic-multi-select"
|
||
classNamePrefix="select"
|
||
/>
|
||
</Grid>
|
||
<Button
|
||
type="submit"
|
||
fullWidth
|
||
variant="contained"
|
||
sx={{ mt: 3, mb: 2, ml: 3 }}
|
||
>
|
||
Регистрация
|
||
</Button>
|
||
</Grid>
|
||
</Box>
|
||
</Box>
|
||
</Container>
|
||
);
|
||
};
|
||
|
||
export default SingUpPage; |