import React, { useEffect, useState } from 'react'; import { useHistory } from 'react-router-dom'; import axios from 'axios'; import { CircularProgress } from '@material-ui/core'; import { LoadingButton } from '@material-ui/lab'; import IconButton from '@mui/material/IconButton'; import RemoveIcon from '@mui/icons-material/Remove'; import { ToastContainer, toast } from 'react-toastify'; import 'react-toastify/dist/ReactToastify.css'; import Alert from '../../component/alert'; import Notification from '../notification'; const MeetingEdit = (props) => { const history = useHistory(); const father_id = document.getElementById('father_id').value; const meeting_id = props.match.params.meeting_id; const [notice, setNotice] = useState(localStorage.getItem('notice')); const [title, setTitle] = useState(''); const [memo, setMemo] = useState(''); const [text, setText] = useState(''); const [pdf, setPdf] = useState(''); const [meeting_image, setMeetingImages] = useState([]); const [approval_list, setApproval] = useState([]); const [children_list, setChildrenList] = useState([]); const [_422errors, set422Errors] = useState({title:'', text:'', memo:'', pdf:'', image:''}) const [_400error, set400Error] = useState(''); const [_success, setSuccess] = useState(''); const [loaded, setLoaded] = useState(false); const [submit, setSubmit] = useState(false); const [check_radio, setCheckRadio] = useState(null); useEffect(() => { setLoaded(false); axios.get(`/api/fathers/meetings/detail/${meeting_id}`, {params: { father_id: father_id}}) .then(response => { setLoaded(true); setNotice(response.data.notice) if(response.data.status_code==200){ setTitle(response.data.params?.title); setMemo(response.data.params?.memo); setText(response.data.params?.text); setMeetingImages(response.data.params?.meeting_image); setApproval(response.data.params?.approval); setPdf(response.data.params?.pdf); var list = [...response.data.params?.children]; var approval = [...response.data.params?.approval]; var arr = []; for(var i=0; iele.child_id == list[i].child_id) >= 0) arr.push({...list[i], checked: true}); else arr.push({...list[i], checked: false}); } setChildrenList(arr); } else{ set400error("失敗しました。"); } }); }, []); //------------------------------------------------------------- useEffect(()=>{ var navbar_list = document.getElementsByClassName("mypage-nav-list__item"); for(let i=0; i{ if(!loaded) return; //if dont load data var list = []; if(check_radio=="false"){ //send all children list = [...children_list]; for(var i=0; iele.child_id == list[i].child_id) >= 0) list[i].checked = true; else list[i].checked = false; } } setChildrenList(list); },[check_radio]) //---------------------------------------------------------------------- const handleSubmit = (e) => { e.preventDefault(); set422Errors({title:'',memo:'',text:'',pdf:'',image:''}); var approval_registerIndexes = []; var approval_deleteIndexes = []; for(let i=0; iele.child_id == children_list[i].child_id) < 0) approval_registerIndexes.push(children_list[i].child_id); } } for(let i=0; i ele.checked && ele.child_id == approval_list[i].child_id) < 0) approval_deleteIndexes.push(approval_list[i].child_id); } const formdata = new FormData(); formdata.append('children', JSON.stringify(approval_registerIndexes)); axios.post('/api/fathers/meeting/approvals/register', formdata, {params:{meeting_id: meeting_id}}) axios.delete('/api/fathers/meeting/approvals/delete', {params:{children: approval_deleteIndexes, meeting_id: meeting_id}}) const request = { title: title, text: text, memo: memo, pdf: pdf }; setSubmit(true); axios.put(`/api/fathers/meetings/update/${meeting_id}`, request) .then(response => { setNotice(response.data.notice); setSubmit(false); switch(response.data.status_code){ case 200: { history.push({ pathname: `/p-account/meeting/detail/${props.match.params?.meeting_id}`, state: "編集が完了しました!" }); break; } case 400: set400Error("編集が失敗しました。"); break; case 422: set422Errors(response.data.error_messages); break; } }); } const handleImageChange = (e) => { e.preventDefault(); let reader = new FileReader(); let _file = e.target.files[0]; if(!_file) return; reader.readAsDataURL(_file); reader.onloadend = () => { const formdata = new FormData(); formdata.append('image', reader.result); axios.post(`/api/fathers/meeting/images/register`, formdata, {params:{meeting_id: meeting_id}}) .then(response => { setNotice(response.data.notice); switch(response.data.status_code){ case 200: setMeetingImages(response.data.params); break; case 400: set400Error(response.data.error_messages); break; case 422: set422Errors(response.data.error_messages); break; } }); }; }; const handleDeleteImage = (image_id) => { axios.delete(`/api/fathers/meeting/images/delete/${meeting_id}`, {params:{image_id: image_id}}) .then(response=>{ setNotice(response.data.notice); switch(response.data.status_code){ case 200: setMeetingImages(response.data.params); break; case 400: set400Error("画像の削除に失敗しました。"); } }) } const handleChangePDF = (e) => { e.preventDefault(); let reader = new FileReader(); let _file = e.target.files[0]; if(!_file) return; reader.readAsDataURL(_file); reader.onloadend = () => { setPdf(reader.result); } } const handleCheck = (e, index) => { var list = [...children_list]; list[index].checked = e.target.checked; setChildrenList(list); } const notify_delete = () => toast.success("削除成功しました。", { position: "top-right", autoClose: 5000, className:"bg-danger", hideProgressBar: true, closeOnClick: true, pauseOnHover: true, draggable: false, progress: undefined, style:{ color: '#ffffff'} }); const notify_save = () => toast.success("更新が成功しました。", { position: "top-right", autoClose: 5000, className:"bg-danger", hideProgressBar: true, closeOnClick: true, pauseOnHover: true, draggable: false, progress: undefined, style:{ color: '#ffffff'} }); return (

ミーティング編集

{ !loaded && } { loaded &&
setTitle(e.target.value)} className={`input-default input-title input-h60 input-w480 ${ _422errors.title && 'is-invalid c-input__target'} `} id="title" /> { _422errors.title && {_422errors.title} }