update admin popup error
This commit is contained in:
parent
df69cd3467
commit
1cb0f9cb8e
|
|
@ -91,15 +91,19 @@ const useClasses = () => {
|
|||
try {
|
||||
const createdClass = await classService.createData(newClass);
|
||||
setClasses((prevClasses) => [...prevClasses, createdClass.payload]);
|
||||
} catch (err) {
|
||||
setError(err);
|
||||
}finally{
|
||||
resetForm();
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
loading: false,
|
||||
successMessage: 'Your new entry has been successfully created and saved.'
|
||||
}));
|
||||
resetForm();
|
||||
} catch (err) {
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
title: "ERROR",
|
||||
loading: false,
|
||||
successMessage: err.response.data.message
|
||||
}));
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -117,14 +121,18 @@ const useClasses = () => {
|
|||
setClasses((prevClasses) =>
|
||||
prevClasses.map((s) => (s.ID_CLASS === id ? classData.payload : s))
|
||||
);
|
||||
} catch (err) {
|
||||
setError(err);
|
||||
}finally{
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
loading: false,
|
||||
successMessage: 'Your data has been successfully updated.'
|
||||
}));
|
||||
} catch (err) {
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
title: "ERROR",
|
||||
loading: false,
|
||||
successMessage: err.response.data.message
|
||||
}));
|
||||
}
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -40,6 +40,9 @@ const useUpdateExercises = (levelId) => {
|
|||
matchingPairs: {},
|
||||
});
|
||||
|
||||
const [imageContainer, setImageContainer] = useState("");
|
||||
const [audioContainer, setAudioContainer] = useState("");
|
||||
|
||||
const [selectedQuestion, setSelectedQuestion] = useState(false);
|
||||
|
||||
const [show, setShow] = useState(false);
|
||||
|
|
@ -55,9 +58,9 @@ const useUpdateExercises = (levelId) => {
|
|||
QUESTION:"",
|
||||
QUESTION_TYPE:"",
|
||||
SCORE_WEIGHT:"",
|
||||
AUDIO:"",
|
||||
IMAGE:"",
|
||||
VIDEO:"",
|
||||
AUDIO:'',
|
||||
IMAGE:'',
|
||||
VIDEO:'',
|
||||
multipleChoices:"",
|
||||
trueFalse:"",
|
||||
matchingPairs:{},
|
||||
|
|
@ -82,6 +85,8 @@ const useUpdateExercises = (levelId) => {
|
|||
|
||||
const [selectedQuestionNumber, setSelectedQuestionNumber] = useState(null);
|
||||
const handleShow = (data) => {
|
||||
setImageContainer("");
|
||||
setAudioContainer("");
|
||||
setSelectedQuestion(true);
|
||||
setSelectedQuestionNumber(data+1);
|
||||
setFormData({
|
||||
|
|
@ -91,13 +96,19 @@ const useUpdateExercises = (levelId) => {
|
|||
QUESTION: exerciseData[data].QUESTION || "",
|
||||
QUESTION_TYPE: exerciseData[data].QUESTION_TYPE || "",
|
||||
SCORE_WEIGHT: exerciseData[data].SCORE_WEIGHT || "",
|
||||
AUDIO: exerciseData[data].AUDIO || "",
|
||||
IMAGE: exerciseData[data].IMAGE || "",
|
||||
VIDEO: exerciseData[data].VIDEO || "",
|
||||
AUDIO: exerciseData[data].AUDIO || '',
|
||||
IMAGE: exerciseData[data].IMAGE || '',
|
||||
VIDEO: exerciseData[data].VIDEO || '',
|
||||
multipleChoices: exerciseData[data].multipleChoices || "",
|
||||
trueFalse: exerciseData[data].trueFalse || "",
|
||||
matchingPairs: exerciseData[data].matchingPairs || {},
|
||||
});
|
||||
if(exerciseData[data].IMAGE){
|
||||
setImageContainer(exerciseData[data].IMAGE);
|
||||
}
|
||||
if(exerciseData[data].AUDIO){
|
||||
setAudioContainer(exerciseData[data].AUDIO);
|
||||
}
|
||||
setShow(true);
|
||||
};
|
||||
const handleClose = () => {
|
||||
|
|
@ -105,6 +116,9 @@ const useUpdateExercises = (levelId) => {
|
|||
resetForm();
|
||||
setSelectedQuestion(null);
|
||||
setMediaPreview(null);
|
||||
|
||||
setImageContainer("");
|
||||
setAudioContainer("");
|
||||
};
|
||||
|
||||
const handleShowNewData = () => {
|
||||
|
|
@ -225,8 +239,13 @@ const useUpdateExercises = (levelId) => {
|
|||
}
|
||||
};
|
||||
|
||||
const [deleteMedia, setDeleteMedia] = useState(false);
|
||||
const [deleteMediaType, setDeleteMediaType] = useState(null);
|
||||
const updateQuestion = async () => {
|
||||
setDeleteMedia(false);
|
||||
setDeleteMediaType(null)
|
||||
const id = formData.ID_ADMIN_EXERCISE;
|
||||
|
||||
const updateData = new FormData();
|
||||
updateData.append('ID_LEVEL', levelId);
|
||||
updateData.append('QUESTION', formData.QUESTION);
|
||||
|
|
@ -239,16 +258,28 @@ const useUpdateExercises = (levelId) => {
|
|||
updateData.append('AUDIO', formData.AUDIO);
|
||||
}
|
||||
|
||||
if (formData.VIDEO === "") {
|
||||
if (formData.VIDEO === '') {
|
||||
updateData.append('VIDEO', "");
|
||||
}
|
||||
if (formData.IMAGE === "") {
|
||||
if (formData.IMAGE === '') {
|
||||
updateData.append('IMAGE', "");
|
||||
}
|
||||
if (formData.AUDIO === "") {
|
||||
if (formData.AUDIO === '') {
|
||||
updateData.append('AUDIO', "");
|
||||
}
|
||||
|
||||
//media checker delete
|
||||
console.log('continer',imageContainer);
|
||||
console.log('form',formData.IMAGE);
|
||||
if (imageContainer !== '' && imageContainer !== formData.IMAGE) {
|
||||
setDeleteMedia(true);
|
||||
setDeleteMediaType('image')
|
||||
}
|
||||
if (audioContainer !== '' && audioContainer !== formData.AUDIO) {
|
||||
setDeleteMedia(true);
|
||||
setDeleteMediaType('audio')
|
||||
}
|
||||
|
||||
if (formData.QUESTION_TYPE === "TFQ") {
|
||||
if (typeof formData.trueFalse === 'object') {
|
||||
updateData.append('IS_TRUE', formData.trueFalse[0].IS_TRUE);
|
||||
|
|
@ -271,8 +302,15 @@ const useUpdateExercises = (levelId) => {
|
|||
});
|
||||
}
|
||||
|
||||
const deleteMediaTypeData ={
|
||||
'fileType' : deleteMediaType
|
||||
}
|
||||
handleShowLoader('Updated', '', true);
|
||||
try {
|
||||
if (deleteMedia) {
|
||||
console.log(deleteMediaTypeData);
|
||||
await exerciseService.deleteMedia(id, deleteMediaTypeData);
|
||||
}
|
||||
const update = await exerciseService.updateData(id, updateData);
|
||||
setExerciseData((prevQuestion) =>
|
||||
prevQuestion.map((s) => (s.ID_ADMIN_EXERCISE === id ? update.payload : s))
|
||||
|
|
|
|||
|
|
@ -103,6 +103,16 @@ const deleteData = async (id) => {
|
|||
}
|
||||
};
|
||||
|
||||
const deleteMedia = async (id, data) => {
|
||||
try {
|
||||
const response = await axiosInstance.delete(`/exercise/file/${id}`, data);
|
||||
return response.data;
|
||||
} catch (error) {
|
||||
console.error(`Error deleting question with ID ${id}:`, error);
|
||||
throw error;
|
||||
}
|
||||
};
|
||||
|
||||
export default{
|
||||
fetchData,
|
||||
getExerciseByLevelId,
|
||||
|
|
@ -111,4 +121,5 @@ export default{
|
|||
updateData,
|
||||
sortingData,
|
||||
deleteData,
|
||||
deleteMedia
|
||||
};
|
||||
|
|
|
|||
|
|
@ -83,43 +83,6 @@ const UpdateExercises = () => {
|
|||
<Row className='mb-45'>
|
||||
<Col className='h-fit'>
|
||||
|
||||
{/* <div className="cards">
|
||||
<div className="cards-title d-flex justify-content-between">
|
||||
<div className="d-flex align-items-center">
|
||||
<span style={{ cursor: 'grab' }}><i className="bi bi-list me-3" /></span>
|
||||
<h4>1</h4>
|
||||
<h4>.Multiple Choice</h4>
|
||||
</div>
|
||||
<div className="d-flex">
|
||||
<Button size='sm' variant='outline-warning' className='me-2 border'><i className="bi bi-pencil me-1"></i>edit</Button>
|
||||
<Button size='sm' variant='outline-danger' className='border'><i className="bi bi-trash3"></i></Button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="cards-body">
|
||||
<Row className='mb-2'>
|
||||
<Col className='d-flex align-items-center'>
|
||||
<img src="https://picsum.photos/300/200" alt="" className='me-2 bg-light' style={{aspectRatio:"1/1",width:"5vw",objectPosition:"center",objectFit:"contain"}}/>
|
||||
<p className='m-0 fs-14p'>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorum assumenda tenetur nostrum, consequatur mollitia ea dignissimos adipisci rerum nesciunt laboriosam laborum ut atque beatae facilis nam illum impedit quia eius.</p>
|
||||
</Col>
|
||||
</Row>
|
||||
<span className='fs-12p'>Question Choices</span>
|
||||
<Row>
|
||||
<Col md={6} className='d-flex align-items-center'>
|
||||
<i className="bi bi-check text-success fs-5 me-1"></i><span className='fs-14p'>gatau</span>
|
||||
</Col>
|
||||
<Col md={6} className='d-flex align-items-center'>
|
||||
<i className="bi bi-x text-red fs-5 me-1"></i><span className='fs-14p'>ya ini</span>
|
||||
</Col>
|
||||
<Col md={6} className='d-flex align-items-center'>
|
||||
<i className="bi bi-x text-red fs-5 me-1"></i><span className='fs-14p'>ya itu</span>
|
||||
</Col>
|
||||
<Col md={6} className='d-flex align-items-center'>
|
||||
<i className="bi bi-x text-red fs-5 me-1"></i><span className='fs-14p'>gatau ini</span>
|
||||
</Col>
|
||||
</Row>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
{loading?(
|
||||
<div className='w-100 d-flex justify-content-center align-items-center' style={{height:"20vh"}}>
|
||||
<Spinner animation="grow" variant="primary" />
|
||||
|
|
@ -750,11 +713,6 @@ const UpdateExercises = () => {
|
|||
)
|
||||
)
|
||||
)}
|
||||
{/* <div className="py-4 bg-white d-flex justify-content-end">
|
||||
<Button variant="blue" type="submit" className='ms-2 py-2 px-5 rounded-35'>
|
||||
Update
|
||||
</Button>
|
||||
</div> */}
|
||||
</Form>
|
||||
</Modal.Body>
|
||||
</Modal>
|
||||
|
|
|
|||
|
|
@ -92,7 +92,7 @@ const useProgress = () => {
|
|||
const getClassTopic = async (id) => {
|
||||
setLoadingModal(true);
|
||||
try {
|
||||
const classes = await progressService.getTopicByClass(id, '', '', '', 1000);
|
||||
const classes = await progressService.getTopicByClass(id);
|
||||
setSelected(classes.payload.data);
|
||||
} catch (err) {
|
||||
console.log(err);
|
||||
|
|
|
|||
|
|
@ -78,12 +78,30 @@ const useProgressClass = (progressId) => {
|
|||
.replace(/\./g, ':') + ' WIB';
|
||||
}
|
||||
|
||||
const handleDownloadCSV = async () => {
|
||||
try {
|
||||
const response = await progressService.getCsvProgress();
|
||||
|
||||
const blob = new Blob([response], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
|
||||
const downloadUrl = URL.createObjectURL(blob);
|
||||
|
||||
const link = document.createElement('a');
|
||||
link.href = downloadUrl;
|
||||
link.download = `progress ${name}-${topic}.csv`;
|
||||
link.click();
|
||||
|
||||
URL.revokeObjectURL(downloadUrl);
|
||||
} catch (error) {
|
||||
console.error('Error downloading file:', error);
|
||||
alert('Gagal mengunduh file');
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
progress,
|
||||
section,
|
||||
topic,
|
||||
name,
|
||||
nisn,
|
||||
loading,
|
||||
error,
|
||||
|
||||
|
|
@ -94,7 +112,8 @@ const useProgressClass = (progressId) => {
|
|||
handlePageChange,
|
||||
handleLimitsChange,
|
||||
handleSearchChange,
|
||||
formatLocalDate
|
||||
formatLocalDate,
|
||||
handleDownloadCSV
|
||||
};
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -30,9 +30,9 @@ const getStudentById = async (id) => {
|
|||
}
|
||||
};
|
||||
|
||||
const getTopicByClass = async (id, search, sort, page, limit) => {
|
||||
const getTopicByClass = async (id) => {
|
||||
try {
|
||||
const response = await axiosInstance.get(`/monitoring/class/${id}?search=${search}&sort=${sort}&page=${page}&limit=${limit}`);
|
||||
const response = await axiosInstance.get(`/monitoring/class/${id}`);
|
||||
return response.data;
|
||||
} catch (error) {
|
||||
console.error('Error fetching progress:', error);
|
||||
|
|
@ -52,7 +52,7 @@ const fetchDataStudentProgress = async (id, search, sort, page, limit) => {
|
|||
|
||||
const fetchDataClassProgress = async (dataId, search, sort, page, limit) => {
|
||||
try {
|
||||
const response = await axiosInstance.get(`/monitoring/class?search=${search}&sort=${sort}&page=${page}&limit=${limit}`, dataId);
|
||||
const response = await axiosInstance.post(`/monitoring/class?search=${search}&sort=${sort}&page=${page}&limit=${limit}`, dataId);
|
||||
return response.data;
|
||||
} catch (error) {
|
||||
console.error('Error fetching progress:', error);
|
||||
|
|
@ -60,11 +60,28 @@ const fetchDataClassProgress = async (dataId, search, sort, page, limit) => {
|
|||
}
|
||||
};
|
||||
|
||||
const getCsvProgress = async () => {
|
||||
const configs = {
|
||||
headers: {
|
||||
Authorization: localStorage.getItem('token')
|
||||
},
|
||||
responseType: 'blob',
|
||||
};
|
||||
try {
|
||||
const response = await axiosInstance.get(`/monitoring/class/csv`, configs);
|
||||
return response.data;
|
||||
} catch (error) {
|
||||
console.error(`Error get file:`, error);
|
||||
throw error;
|
||||
}
|
||||
};
|
||||
|
||||
export default{
|
||||
fetchDataStudent,
|
||||
fetchDataClass,
|
||||
getStudentById,
|
||||
getTopicByClass,
|
||||
fetchDataStudentProgress,
|
||||
fetchDataClassProgress
|
||||
fetchDataClassProgress,
|
||||
getCsvProgress
|
||||
};
|
||||
|
|
|
|||
|
|
@ -8,12 +8,10 @@ const ClassProgress = () => {
|
|||
const { progressId } = useParams();
|
||||
const {
|
||||
progress,
|
||||
name,
|
||||
section,
|
||||
topic,
|
||||
name,
|
||||
nisn,
|
||||
loading,
|
||||
error,
|
||||
|
||||
totalPages,
|
||||
totalData,
|
||||
|
|
@ -22,7 +20,8 @@ const ClassProgress = () => {
|
|||
handlePageChange,
|
||||
handleLimitsChange,
|
||||
handleSearchChange,
|
||||
formatLocalDate
|
||||
formatLocalDate,
|
||||
handleDownloadCSV
|
||||
} = useProgressClass(progressId);
|
||||
return (
|
||||
<div className='admin-teachers'>
|
||||
|
|
@ -33,12 +32,12 @@ const ClassProgress = () => {
|
|||
</Button>
|
||||
<Breadcrumb className='custom-breadcrumb'>
|
||||
<Breadcrumb.Item href="/admin/learning-progress">Monitoring Progress</Breadcrumb.Item>
|
||||
<Breadcrumb.Item active>Progress Details</Breadcrumb.Item>
|
||||
<Breadcrumb.Item active>Class Progress Details</Breadcrumb.Item>
|
||||
</Breadcrumb>
|
||||
</Col>
|
||||
<Col sm={6} className="d-flex align-items-center justify-content-end">
|
||||
<Button variant="outline-blue" type="button" className='py-2 bg-white'>
|
||||
<i className="bi bi-download me-2"></i>Download PDF
|
||||
<Button variant="outline-blue" type="button" className='py-2 bg-white' onClick={(e) => { e.preventDefault(); handleDownloadCSV(); }}>
|
||||
<i className="bi bi-download me-2"></i>Download CSV
|
||||
</Button>
|
||||
</Col>
|
||||
</Row>
|
||||
|
|
@ -46,7 +45,7 @@ const ClassProgress = () => {
|
|||
<Col>
|
||||
<div className="cards">
|
||||
<div className="cards-title">
|
||||
<h4 className='mb-2'>{nisn} - {name}</h4>
|
||||
<h4 className='mb-2'>{name}</h4>
|
||||
<span className='text-grey'>{section} / {topic}</span>
|
||||
</div>
|
||||
<div className="cards-body">
|
||||
|
|
@ -63,11 +62,11 @@ const ClassProgress = () => {
|
|||
<Table hover>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>No</th>
|
||||
<th>NISN</th>
|
||||
<th className='text-start'>NISN</th>
|
||||
<th>Full Name</th>
|
||||
<th>Level</th>
|
||||
<th>Score</th>
|
||||
<th>Feedback</th>
|
||||
<th>Start Exercise</th>
|
||||
<th>Finish Exercise</th>
|
||||
</tr>
|
||||
|
|
@ -75,7 +74,7 @@ const ClassProgress = () => {
|
|||
<tbody>
|
||||
{loading?(
|
||||
<tr>
|
||||
<td colSpan={6} style={{height:"20vh"}}>
|
||||
<td colSpan={7} style={{height:"20vh"}}>
|
||||
<Spinner animation="grow" variant="primary" />
|
||||
<Spinner animation="grow" variant="secondary" />
|
||||
<Spinner animation="grow" variant="success" />
|
||||
|
|
@ -88,18 +87,18 @@ const ClassProgress = () => {
|
|||
progress.length > 0?(
|
||||
progress.map((data, index) => (
|
||||
<tr key={index}>
|
||||
<td>{index + 1}</td>
|
||||
<td>{data.NISN}</td>
|
||||
<td className='text-start'>{data.NISN}</td>
|
||||
<td>{data.NAME_USERS}</td>
|
||||
<td>{data.NAME_LEVEL}</td>
|
||||
<td>{data.SCORE}</td>
|
||||
<td>{data.FEEDBACK_STUDENT ?? '-'}</td>
|
||||
<td>{formatLocalDate(data.STUDENT_START)}</td>
|
||||
<td>{formatLocalDate(data.STUDENT_FINISH)}</td>
|
||||
</tr>
|
||||
))
|
||||
):(
|
||||
<tr>
|
||||
<td colSpan={6} style={{height:'20vh'}}>
|
||||
<td colSpan={7} style={{height:'20vh'}}>
|
||||
<h3>Empty Data</h3>
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -206,26 +206,13 @@ const ManageProgress = () => {
|
|||
</Row>
|
||||
</Tab.Container>
|
||||
|
||||
<Modal show={show} onHide={handleClose} className='modal-admin' size='lg' centered>
|
||||
<Modal show={show} onHide={handleClose} className='modal-admin' size='xl' centered>
|
||||
<Modal.Header closeButton>
|
||||
<Modal.Title>Select Topic</Modal.Title>
|
||||
</Modal.Header>
|
||||
<Modal.Body>
|
||||
<Row>
|
||||
<Col xs={6} lg={4} className='mb-3'>
|
||||
<Card className='h-100'>
|
||||
<Card.Body>
|
||||
<Card.Title as='h3'>Vocabulary</Card.Title>
|
||||
<Card.Text className='mb-4 fs-14p'>
|
||||
The legend of naresh
|
||||
</Card.Text>
|
||||
<Button as={Link} to={`c/${selectedId}&21a9c23e-9737-49f5-bbd5-5b0ecac3f73d`} variant="warning" className='py-2 w-100 rounded-35'>See Details</Button>
|
||||
</Card.Body>
|
||||
</Card>
|
||||
</Col>
|
||||
</Row>
|
||||
{loadingModal?(
|
||||
<div className='d-flex justify-content-center align-items-center' style={{height:"20vh"}}>
|
||||
<div className='d-flex justify-content-center align-items-center' style={{height:"179px"}}>
|
||||
<Spinner animation="grow" variant="primary" />
|
||||
<Spinner animation="grow" variant="secondary" />
|
||||
<Spinner animation="grow" variant="success" />
|
||||
|
|
@ -251,7 +238,9 @@ const ManageProgress = () => {
|
|||
))}
|
||||
</Row>
|
||||
):(
|
||||
<h2 className='my-3 text-center'>No Progress from this class</h2>
|
||||
<div className='d-flex justify-content-center align-items-center' style={{height:"179px"}}>
|
||||
<h2 className='m-0 text-center'>No Progress from this class</h2>
|
||||
</div>
|
||||
)
|
||||
)}
|
||||
</Modal.Body>
|
||||
|
|
|
|||
|
|
@ -102,14 +102,18 @@ const useSections = () => {
|
|||
setSections((prevSections) =>
|
||||
prevSections.map((s) => (s.ID_SECTION === id ? section.payload : s))
|
||||
);
|
||||
} catch (err) {
|
||||
setError(err);
|
||||
}finally{
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
loading: false,
|
||||
successMessage: 'Your data has been successfully updated.'
|
||||
}));
|
||||
} catch (err) {
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
title: "ERROR",
|
||||
loading: false,
|
||||
successMessage: err.response.data.message
|
||||
}));
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -121,15 +125,19 @@ const useSections = () => {
|
|||
handleShowLoader('Deleted', '', true)
|
||||
try {
|
||||
await sectionService.deleteData(id);
|
||||
} catch (err) {
|
||||
setError(err);
|
||||
}finally{
|
||||
setSections((prevSections) => prevSections.filter((s) => s.ID_SECTION !== id));
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
loading: false,
|
||||
successMessage: 'Your data has been successfully deleted.'
|
||||
}));
|
||||
} catch (err) {
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
title: "ERROR",
|
||||
loading: false,
|
||||
successMessage: err.response.data.message
|
||||
}));
|
||||
}
|
||||
}
|
||||
setLoaderState(prev => ({ ...prev, handleConfirm: confirmDelete }));
|
||||
|
|
|
|||
|
|
@ -225,7 +225,7 @@ const ManageSections = () => {
|
|||
|
||||
<Modal show={show} onHide={handleClose} className='modal-admin' size='lg' centered>
|
||||
<Modal.Header closeButton>
|
||||
<Modal.Title>Update Teacher Data</Modal.Title>
|
||||
<Modal.Title>Update Section Data</Modal.Title>
|
||||
</Modal.Header>
|
||||
<Modal.Body>
|
||||
<Form onSubmit={(e) => { e.preventDefault(); editSection(); }}>
|
||||
|
|
|
|||
|
|
@ -22,6 +22,7 @@ const useStudents = () => {
|
|||
const [loaderState, setLoaderState] = useState({ loading: false, successMessage: '', title: '', description: '', confirmAction: false });
|
||||
|
||||
const resetForm = () =>{
|
||||
setFileImport(null);
|
||||
setFormData({
|
||||
fullName: '',
|
||||
nisn: '',
|
||||
|
|
@ -41,15 +42,19 @@ const useStudents = () => {
|
|||
};
|
||||
const createdStudent = await studentService.createData(newStudent);
|
||||
setStudents((prevStudents) => [...prevStudents, createdStudent.payload]);
|
||||
} catch (err) {
|
||||
setError(err);
|
||||
}finally{
|
||||
resetForm();
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
loading: false,
|
||||
successMessage: 'Your new entry has been successfully created and saved.'
|
||||
}));
|
||||
} catch (err) {
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
title: "ERROR",
|
||||
loading: false,
|
||||
successMessage: err.response.data.message
|
||||
}));
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -60,16 +65,19 @@ const useStudents = () => {
|
|||
console.log(file);
|
||||
try {
|
||||
const response = await studentService.registerImport(fileData);
|
||||
console.log(response.data);
|
||||
} catch (err) {
|
||||
setError(err);
|
||||
}finally{
|
||||
resetForm();
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
loading: false,
|
||||
successMessage: 'Your new entry has been successfully created and saved.'
|
||||
}));
|
||||
resetForm();
|
||||
} catch (err) {
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
title: "ERROR",
|
||||
loading: false,
|
||||
successMessage: err.response.data.message
|
||||
}));
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -83,14 +91,18 @@ const useStudents = () => {
|
|||
setStudents((prevStudents) =>
|
||||
prevStudents.map((s) => (s.ID === id ? student.payload : s))
|
||||
);
|
||||
} catch (err) {
|
||||
setError(err);
|
||||
}finally{
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
loading: false,
|
||||
successMessage: 'Your data has been successfully updated.'
|
||||
}));
|
||||
} catch (err) {
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
title: "ERROR",
|
||||
loading: false,
|
||||
successMessage: err.response.data.message
|
||||
}));
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -98,15 +110,19 @@ const useStudents = () => {
|
|||
handleShowLoader('Deleted', '', true)
|
||||
try {
|
||||
await studentService.deleteData(id);
|
||||
} catch (err) {
|
||||
setError(err);
|
||||
}finally{
|
||||
setStudents((prevStudents) => prevStudents.filter((s) => s.ID !== id));
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
loading: false,
|
||||
successMessage: 'Your data has been successfully deleted.'
|
||||
}));
|
||||
} catch (err) {
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
title: "ERROR",
|
||||
loading: false,
|
||||
successMessage: err.response.data.message
|
||||
}));
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -175,7 +191,8 @@ const useStudents = () => {
|
|||
}, [page, limit]);
|
||||
|
||||
|
||||
const handleDownloadTemplate = async () => {try {
|
||||
const handleDownloadTemplate = async () => {
|
||||
try {
|
||||
const response = await studentService.getTemplate();
|
||||
|
||||
const blob = new Blob([response], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
|
||||
|
|
@ -183,7 +200,7 @@ const useStudents = () => {
|
|||
|
||||
const link = document.createElement('a');
|
||||
link.href = downloadUrl;
|
||||
link.download = 'template.xls';
|
||||
link.download = 'template.xlsx';
|
||||
link.click();
|
||||
|
||||
URL.revokeObjectURL(downloadUrl);
|
||||
|
|
|
|||
|
|
@ -377,7 +377,7 @@ const ManageStudents = () => {
|
|||
onDragLeave={handleDragLeave}
|
||||
>
|
||||
<h5 className={`m-0 ${fileImport ? `text-green fs-3` : `text-grey`}`}>{fileImport ? fileImport.name : "Upload Excel file here"}</h5>
|
||||
<span className={`fs-14p ${fileImport ? `text-green` : `text-grey`}`}>{fileImport ? "Your file is ready to import" : "Please make sure your Excel file follows the template."}</span>
|
||||
<span className={`fs-14p ${fileImport ? `text-green` : `text-grey`}`}>{fileImport ? "Your file is ready to import" : "Please make sure your Excel file follows the template.(*.xlsx)"}</span>
|
||||
</label>
|
||||
</Row>
|
||||
<div className="d-flex justify-content-end">
|
||||
|
|
|
|||
|
|
@ -40,15 +40,18 @@ const useTeachers = () => {
|
|||
CONFIRM_PASSWORD: data.confirm_pass,
|
||||
};
|
||||
const createdTeacher = await teacherService.createData(newTeacher);
|
||||
setTeachers((prevTeachers) => [...prevTeachers, createdTeacher.payload]);
|
||||
} catch (err) {
|
||||
setError(err);
|
||||
}finally{
|
||||
resetForm();
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
loading: false,
|
||||
successMessage: 'Your new entry has been successfully created and saved.'
|
||||
successMessage: 'New teacher has been successfully created. waiting to verify the email.'
|
||||
}));
|
||||
resetForm();
|
||||
} catch (err) {
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
title: "ERROR",
|
||||
loading: false,
|
||||
successMessage: err.response.data.message
|
||||
}));
|
||||
}
|
||||
};
|
||||
|
|
@ -63,14 +66,18 @@ const useTeachers = () => {
|
|||
setTeachers((prevTeachers) =>
|
||||
prevTeachers.map((s) => (s.ID === id ? Teacher.payload : s))
|
||||
);
|
||||
} catch (err) {
|
||||
setError(err);
|
||||
}finally{
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
loading: false,
|
||||
successMessage: 'Your data has been successfully updated.'
|
||||
}));
|
||||
} catch (err) {
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
title: "ERROR",
|
||||
loading: false,
|
||||
successMessage: err.response.data.message
|
||||
}));
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -78,15 +85,19 @@ const useTeachers = () => {
|
|||
handleShowLoader('Deleted', '', true)
|
||||
try {
|
||||
await teacherService.deleteData(id);
|
||||
} catch (err) {
|
||||
setError(err);
|
||||
}finally{
|
||||
setTeachers((prevTeachers) => prevTeachers.filter((s) => s.ID !== id));
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
loading: false,
|
||||
successMessage: 'Your data has been successfully deleted.'
|
||||
}));
|
||||
} catch (err) {
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
title: "ERROR",
|
||||
loading: false,
|
||||
successMessage: err.response.data.message
|
||||
}));
|
||||
}
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -106,14 +106,18 @@ const useTopics = () => {
|
|||
setTopics((prevTopics) =>
|
||||
prevTopics.map((s) => (s.ID_TOPIC === id ? topic.payload : s))
|
||||
);
|
||||
} catch (err) {
|
||||
setError(err);
|
||||
}finally{
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
loading: false,
|
||||
successMessage: 'Your data has been successfully updated.'
|
||||
}));
|
||||
} catch (err) {
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
title: "ERROR",
|
||||
loading: false,
|
||||
successMessage: err.response.data.message
|
||||
}));
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -125,15 +129,19 @@ const useTopics = () => {
|
|||
handleShowLoader('Deleted', '', true)
|
||||
try {
|
||||
await topicService.deleteData(id);
|
||||
} catch (err) {
|
||||
setError(err);
|
||||
}finally{
|
||||
setTopics((prevTopics) => prevTopics.filter((s) => s.ID_TOPIC !== id));
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
loading: false,
|
||||
successMessage: 'Your data has been successfully deleted.'
|
||||
}));
|
||||
} catch (err) {
|
||||
setLoaderState(prev => ({
|
||||
...prev,
|
||||
title: "ERROR",
|
||||
loading: false,
|
||||
successMessage: err.response.data.message
|
||||
}));
|
||||
}
|
||||
}
|
||||
setLoaderState(prev => ({ ...prev, handleConfirm: confirmDelete }));
|
||||
|
|
|
|||
|
|
@ -108,7 +108,7 @@ const ManageTopics = () => {
|
|||
<td>{topic.NAME_TOPIC}</td>
|
||||
<td>{topic.DESCRIPTION_TOPIC}</td>
|
||||
<td className='text-center action-col'>
|
||||
<div class="d-flex">
|
||||
<div className="d-flex">
|
||||
<Button size='sm' className='btn-edit' onClick={() => handleShow(topic)}>
|
||||
<i className="bi bi-pencil-square"></i>
|
||||
</Button>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import React, { useState } from 'react';
|
||||
import { Table, Row, Col, Nav, Tab, Button, Form, InputGroup, Dropdown, DropdownButton, Modal } from 'react-bootstrap';
|
||||
import { Table, Row, Col, Nav, Tab, Button, Form, Spinner, Modal } from 'react-bootstrap';
|
||||
import avatar from '../../../../assets/images/default-avatar.jpg';
|
||||
import ilustration from '../../../../assets/images/illustration/changePass.png';
|
||||
import successModal from '../../../../assets/images/illustration/successModal.png';
|
||||
|
|
@ -49,8 +49,8 @@ const Setting = () => {
|
|||
|
||||
return (
|
||||
<div className='admin-students'>
|
||||
<h2 className='page-title strip'>Students</h2>
|
||||
<p className='page-desc'>Description of students.</p>
|
||||
<h2 className='page-title strip'>Admin Profile</h2>
|
||||
<p className='page-desc'>Manage your account.</p>
|
||||
<Tab.Container id="left-tabs-example" defaultActiveKey="profile">
|
||||
<Row className='mb-45'>
|
||||
<Col xs={12}>
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user