diff --git a/src/roles/admin/manage_section/services/serviceSections.jsx b/src/roles/admin/manage_section/services/serviceSections.jsx index 51c87bf..07a7311 100644 --- a/src/roles/admin/manage_section/services/serviceSections.jsx +++ b/src/roles/admin/manage_section/services/serviceSections.jsx @@ -30,7 +30,7 @@ const fetchData= async (search, sort, page, limit) => { const getSectionById = async (id) => { try { - const response = await axios.get(`${API_URL}/${id}`, config); + const response = await axiosInstance.get(`/${id}`); return response.data; } catch (error) { console.error(`Error fetching section with ID ${id}:`, error); @@ -40,7 +40,7 @@ const getSectionById = async (id) => { const createData = async (sectionData) => { try { - const response = await axios.post(`${API_URL}/section`, sectionData, config); + const response = await axiosInstance.post(`/section`, sectionData); return response.data; } catch (error) { console.error('Error adding section:', error); @@ -50,7 +50,7 @@ const createData = async (sectionData) => { const updateData = async (id, sectionData) => { try { - const response = await axios.put(`${API_URL}/section/update/${id}`, sectionData, config); + const response = await axiosInstance.put(`/section/update/${id}`, sectionData); return response.data; } catch (error) { console.error(`Error updating section with ID ${id}:`, error); @@ -60,7 +60,7 @@ const updateData = async (id, sectionData) => { const deleteData = async (id) => { try { - const response = await axios.delete(`${API_URL}/section/delete/${id}`, config); + const response = await axiosInstance.delete(`/section/delete/${id}`); return response.data; } catch (error) { console.error(`Error deleting section with ID ${id}:`, error); diff --git a/src/roles/admin/manage_students/hooks/useStudents.jsx b/src/roles/admin/manage_students/hooks/useStudents.jsx index 66f545f..a674a85 100644 --- a/src/roles/admin/manage_students/hooks/useStudents.jsx +++ b/src/roles/admin/manage_students/hooks/useStudents.jsx @@ -5,6 +5,7 @@ const useStudents = () => { const [students, setStudents] = useState([]); const [loading, setLoading] = useState(true); const [error, setError] = useState(null); + const [fileImport, setFileImport] = useState(null); const [selectedStudent, setSelectedStudent] = useState(null); const [formData, setFormData] = useState({ @@ -30,14 +31,13 @@ const useStudents = () => { }); } + const resetImportFile = () => {setFileImport(null)} + const createStudent = async (data) => { try { const newStudent ={ NAME_USERS: data.fullName, - EMAIL: data.email, NISN: data.nisn, - PASSWORD: data.pass, - CONFIRM_PASSWORD: data.confirm_pass, }; const createdStudent = await studentService.createData(newStudent); setStudents((prevStudents) => [...prevStudents, createdStudent.payload]); @@ -53,6 +53,26 @@ const useStudents = () => { } }; + const importRegister = async () => { + const fileData = new FormData(); + const file = fileImport; + fileData.append('file', file); + 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.' + })); + } + } + const editStudent = async (id, data) => { const formData = new FormData(); formData.append('NAME_USERS', data.fullName); @@ -94,6 +114,10 @@ const useStudents = () => { setFormData({ ...formData, [e.target.name]: e.target.value }); }; + const handleFileChange = (e) => { + setFileImport(e.target.files[0]); + }; + const handleShow = (data) => { setSelectedStudent(data); setFormData({ @@ -151,6 +175,24 @@ const useStudents = () => { }, [page, limit]); + const handleDownloadTemplate = async () => {try { + const response = await studentService.getTemplate(); + + 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 = 'template.xls'; + link.click(); + + URL.revokeObjectURL(downloadUrl); + } catch (error) { + console.error('Error downloading file:', error); + alert('Gagal mengunduh file'); + } + } + return { students, loading, @@ -182,7 +224,12 @@ const useStudents = () => { page, handlePageChange, handleLimitsChange, - handleSerachChange + handleSerachChange, + handleFileChange, + handleDownloadTemplate, + importRegister, + fileImport, + resetImportFile }; }; diff --git a/src/roles/admin/manage_students/services/serviceStudents.jsx b/src/roles/admin/manage_students/services/serviceStudents.jsx index a057d07..c27a960 100644 --- a/src/roles/admin/manage_students/services/serviceStudents.jsx +++ b/src/roles/admin/manage_students/services/serviceStudents.jsx @@ -1,13 +1,5 @@ -import axios from 'axios'; -import { API_URL } from '../../../../utils/Constant'; import axiosInstance from '../../../../utils/axiosInstance'; -const config = { - headers: { - Authorization: localStorage.getItem('token') - } -}; - const fetchData= async (search, sort, page, limit) => { try { const response = await axiosInstance.get(`/user/student?search=${search}&sort=${sort}&page=${page}&limit=${limit}`); @@ -20,7 +12,7 @@ const fetchData= async (search, sort, page, limit) => { const getStudentById = async (id) => { try { - const response = await axios.get(`${API_URL}/${id}`, config); + const response = await axiosInstance.get(`/student/${id}`); return response.data; } catch (error) { console.error(`Error fetching student with ID ${id}:`, error); @@ -30,7 +22,7 @@ const getStudentById = async (id) => { const createData = async (studentData) => { try { - const response = await axios.post(`${API_URL}/register/student`, studentData, config); + const response = await axiosInstance.post(`/admin/register/student`, studentData); return response.data; } catch (error) { console.error('Error adding student:', error); @@ -40,7 +32,7 @@ const createData = async (studentData) => { const updateData = async (id, studentData) => { try { - const response = await axios.put(`${API_URL}/user/update/${id}`, studentData, config); + const response = await axiosInstance.put(`/user/update/${id}`, studentData); return response.data; } catch (error) { console.error(`Error updating student with ID ${id}:`, error); @@ -50,7 +42,7 @@ const updateData = async (id, studentData) => { const deleteData = async (id) => { try { - const response = await axios.delete(`${API_URL}/user/delete/${id}`, config); + const response = await axiosInstance.delete(`/user/delete/${id}`); return response.data; } catch (error) { console.error(`Error deleting student with ID ${id}:`, error); @@ -58,10 +50,38 @@ const deleteData = async (id) => { } }; +const getTemplate = async () => { + const configs = { + headers: { + Authorization: localStorage.getItem('token') + }, + responseType: 'blob', + }; + try { + const response = await axiosInstance.get(`/user/sendExcelExample`, configs); + return response.data; + } catch (error) { + console.error(`Error get file:`, error); + throw error; + } +}; + +const registerImport = async (file) => { + try { + const response = await axiosInstance.post(`/admin/register/student/csv`, file); + return response.data; + } catch (error) { + console.error('Error adding student:', error); + throw error; + } +}; + export default{ fetchData, getStudentById, createData, updateData, - deleteData + deleteData, + getTemplate, + registerImport }; diff --git a/src/roles/admin/manage_students/views/ManageStudents.jsx b/src/roles/admin/manage_students/views/ManageStudents.jsx index 6201b62..83ed565 100644 --- a/src/roles/admin/manage_students/views/ManageStudents.jsx +++ b/src/roles/admin/manage_students/views/ManageStudents.jsx @@ -35,7 +35,12 @@ const ManageStudents = () => { setSearch, handlePageChange, handleLimitsChange, - handleSerachChange + handleSerachChange, + handleFileChange, + handleDownloadTemplate, + importRegister, + fileImport, + resetImportFile } = useStudents(); const handleCreate = async (e) => { @@ -44,6 +49,12 @@ const ManageStudents = () => { await createStudent(formData); }; + const handleImport = async (e) => { + handleShowLoader('Created', '', true) + e.preventDefault(); + await importRegister(); + }; + const handleUpdate = async (e) => { handleClose(); handleShowLoader('Updated', '', true) @@ -60,6 +71,34 @@ const ManageStudents = () => { setLoaderState(prev => ({ ...prev, handleConfirm: confirmDelete })); } + const handleDragOver = (e) => { + e.preventDefault(); // Mencegah browser membuka file + e.stopPropagation(); + }; + + const handleDrop = (e) => { + e.preventDefault(); + e.stopPropagation(); + + const droppedFiles = e.dataTransfer.files; // Ambil file dari drag event + if (droppedFiles.length) { + // Kirim file ke input + handleFileChange({ target: { files: droppedFiles } }); + } + }; + + const handleDragEnter = (e) => { + e.preventDefault(); + e.stopPropagation(); + e.target.classList.add('dragging'); + }; + + const handleDragLeave = (e) => { + e.preventDefault(); + e.stopPropagation(); + e.target.classList.remove('dragging'); + }; + if (error) { <>{error}> } @@ -67,7 +106,7 @@ const ManageStudents = () => { return (
Description of students.
+Easily add students to their classes and organize them efficiently.