You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
81 lines
2.4 KiB
81 lines
2.4 KiB
import React, { useState } from 'react';
|
|
import { useNavigate } from 'react-router-dom';
|
|
import {
|
|
AppBar,
|
|
Toolbar,
|
|
Typography,
|
|
Container,
|
|
Box,
|
|
Button,
|
|
Drawer,
|
|
List,
|
|
ListItemText,
|
|
ListItemIcon,
|
|
ListItemButton,
|
|
Divider,
|
|
IconButton,
|
|
TextField,
|
|
Paper,
|
|
Alert,
|
|
Link,
|
|
Grid,
|
|
} from '@mui/material';
|
|
import { LoginCredentials } from '../types/types';
|
|
import { authApi } from '../services/api';
|
|
import { GENERAL_ERRORS } from '../constants/errorMessages';
|
|
|
|
const AddDishes1: React.FC = () => {
|
|
const navigate = useNavigate();
|
|
const [dish, setDish] = useState("");
|
|
// エラーメッセージの状態管理
|
|
const [error, setError] = useState(false);
|
|
|
|
const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
|
|
setDish(event.target.value);
|
|
};
|
|
const handleSubmit = async (e: React.FormEvent) => {
|
|
e.preventDefault(); // フォームのデフォルト送信動作を防止
|
|
if (!dish.trim()) {
|
|
setError(true);
|
|
} else {
|
|
alert("送信成功！");
|
|
navigate('/add2'); // タスク一覧ページにリダイレクト
|
|
}
|
|
};
|
|
|
|
return (
|
|
<div>
|
|
<Typography variant="h4" component="h1" gutterBottom>
|
|
料理の追加・編集
|
|
</Typography>
|
|
<Box component="form" onSubmit={handleSubmit}>
|
|
<div style={{ border: '3px solid black', borderRadius: '8px', backgroundColor: '#add8e6', height: 'auto', padding: '10px', textAlign: 'center'}}>
|
|
<TextField
|
|
required
|
|
// id="username"
|
|
label="追加・編集したい料理名を入力"
|
|
placeholder='ここに料理名を入力'
|
|
variant="outlined"
|
|
InputLabelProps={{ style: { fontSize: "40px" }}}
|
|
style={{width: "80%" }}
|
|
InputProps={{ style: { fontSize: "40px"} }}
|
|
// name="username"
|
|
// autoComplete="username"
|
|
autoFocus
|
|
value={dish}
|
|
onChange={handleChange}
|
|
error={error}
|
|
helperText={error ? "入力が必要です" : ""}
|
|
/>
|
|
</div>
|
|
<div style={{position: "fixed", left: "75%", transform: 'translateX(-50%)', bottom: "10px"}}>
|
|
<Button type="submit" variant='contained' sx={{ width: "250px", height: "60px", fontSize: "40px" }} color="primary" >
|
|
編集・追加{dish}
|
|
</Button>
|
|
</div>
|
|
</Box>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default AddDishes1; |