43 行
1.3 KiB
JavaScript
43 行
1.3 KiB
JavaScript
import React, {useState} from 'react';
|
|
import {
|
|
Box,
|
|
Dialog,
|
|
DialogTitle,
|
|
Slide
|
|
} from '@mui/material';
|
|
|
|
const Transition = React.forwardRef(function Transition(props, ref) {
|
|
return <Slide direction="up" ref={ref} {...props} />;
|
|
});
|
|
|
|
|
|
export default function ModalEditMemo({ show, content, handleClose, handleUpdateMemo}){
|
|
|
|
const [memo, setMemo] = useState(content ? content : '');
|
|
|
|
const handleChange = (memo) => {
|
|
setMemo(memo);
|
|
handleUpdateMemo(memo);
|
|
}
|
|
|
|
return (
|
|
<Dialog
|
|
open={show}
|
|
TransitionComponent={Transition}
|
|
keepMounted
|
|
aria-describedby="alert-dialog-slide-description"
|
|
onClose={handleClose}
|
|
>
|
|
<DialogTitle sx={{padding:'20px 10px',textAlign:'center', borderBottom:'1px solid rgb(239 236 236)'}}>
|
|
<span className="ft-16 text-center font-weight-bold">メモ</span>
|
|
</DialogTitle>
|
|
<Box sx={{ p:'10px', pb:'10px'}}>
|
|
<Box id="alert-dialog-slide-description">
|
|
<textarea value={ memo } onChange={e=>handleChange(e.target.value)} style={{ height: '300px', borderRadius:5, background:'#F0F0F0', padding:'12px', fontSize:'15px' }} />
|
|
</Box>
|
|
</Box>
|
|
</Dialog>
|
|
)
|
|
}
|
|
|