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.
115 lines
3.9 KiB
115 lines
3.9 KiB
import { useState } from 'react';
|
|
import {
|
|
Dialog,
|
|
DialogTitle,
|
|
DialogContent,
|
|
DialogActions,
|
|
TextField,
|
|
Button,
|
|
Box,
|
|
} from '@mui/material';
|
|
import { NewStock } from '../types/types';
|
|
import BuyExpDateSelect from './BuyExpDateSelect';
|
|
/*import DatePicker, { registerLocale } from 'react-datepicker';
|
|
import { ja } from 'date-fns/locale/ja'; // date-fnsの日本語ロケールをインポート*/
|
|
|
|
/*// 日付をyyyy-MM-dd形式で返す関数
|
|
const formatDateLocal = (date: Date) => {
|
|
const year = date.getFullYear();
|
|
const month = (date.getMonth() + 1).toString().padStart(2, '0');
|
|
const day = date.getDate().toString().padStart(2, '0');
|
|
return `${year}-${month}-${day}`;
|
|
};*/
|
|
|
|
// 日本語ロケールを登録
|
|
//registerLocale('ja', ja);
|
|
|
|
const BuyDialog = ({
|
|
openDialog,
|
|
setOpenDialog,
|
|
stuffName,
|
|
newStock,
|
|
setNewStock,
|
|
onSubmit,
|
|
}: {
|
|
openDialog: boolean,
|
|
setOpenDialog: (open: boolean) => void,
|
|
stuffName: string,
|
|
newStock: NewStock,
|
|
setNewStock: (tobuy: NewStock) => void,
|
|
onSubmit: () => void,
|
|
}) => {
|
|
|
|
return (
|
|
|
|
|
|
<Dialog open={openDialog} onClose={() => setOpenDialog(false)} disableScrollLock={true} PaperProps={{ sx: { minHeight: '600px', maxHeight: '80vh' } }}
|
|
>
|
|
<DialogTitle>在庫登録</DialogTitle>
|
|
<DialogContent>
|
|
<Box sx={{ pt: 1 }}>
|
|
{/* 材料名表示 */}
|
|
<TextField
|
|
margin="dense"
|
|
label="材料名"
|
|
fullWidth
|
|
value={stuffName}
|
|
disabled
|
|
sx={{ marginBottom: 2, marginTop: 2 }}
|
|
/>
|
|
|
|
{/* 価格入力フィールド */}
|
|
<TextField
|
|
autoFocus
|
|
margin="dense"
|
|
label="価格"
|
|
fullWidth
|
|
value={newStock.price}
|
|
onChange={(e) => {
|
|
const value = e.target.value;
|
|
if (/^\d*$/.test(value)) {
|
|
setNewStock({ ...newStock, price: value })
|
|
};
|
|
}}
|
|
sx={{ marginBottom: 2 }}
|
|
/>
|
|
|
|
{/* 価格入力フィールド */}
|
|
<TextField
|
|
autoFocus
|
|
margin="dense"
|
|
label="購入数量"
|
|
fullWidth
|
|
value={newStock.amount}
|
|
onChange={(e) => {
|
|
const value = e.target.value;
|
|
if (/^\d*$/.test(value)) {
|
|
setNewStock({ ...newStock, amount: value })
|
|
};
|
|
}}
|
|
sx={{ marginBottom: 2 }}
|
|
/>
|
|
|
|
{/* 購入日・賞味期限入力 */}
|
|
<BuyExpDateSelect newStock={newStock} setNewStock={({buyDate, expDate}) => setNewStock({...newStock, buyDate, expDate}) } />
|
|
|
|
{/* 購入店舗入力フィールド */}
|
|
<TextField
|
|
margin="dense"
|
|
label="店舗"
|
|
value={newStock.shop}
|
|
onChange={(e) => setNewStock({ ...newStock, shop: e.target.value })}
|
|
fullWidth
|
|
/>
|
|
</Box>
|
|
</DialogContent>
|
|
<DialogActions>
|
|
<Button onClick={() => setOpenDialog(false)}>キャンセル</Button>
|
|
<Button onClick={() => { onSubmit() }} variant="contained">登録</Button>
|
|
</DialogActions>
|
|
</Dialog>
|
|
|
|
)
|
|
}
|
|
|
|
export default BuyDialog; |