|
|
|
@ -1,22 +1,26 @@ |
|
|
|
import { useEffect, useState } from "react"; |
|
|
|
import { useEffect, useState } from "react"; |
|
|
|
import Header from "../../../_components/Header"; |
|
|
|
import Header from "../../../_components/Header"; |
|
|
|
import { renderIconButton, renderIconHome } from "../../../_components/renderIcon"; |
|
|
|
import { renderIconButton, renderIconHome, renderIconSearchInput } from "../../../_components/renderIcon"; |
|
|
|
import RateStar from "../../../_components/RateStar"; |
|
|
|
import RateStar from "../../../_components/RateStar"; |
|
|
|
import { defaultMonthYearSemester, getListMonthBySemester, LIST_SCHOOL_YEAR, LIST_SEMESTER, PRIMARY_COLOR } from "../../../_constants/common"; |
|
|
|
import { defaultMonthYearSemester, getListMonthBySemester, LIST_SCHOOL_YEAR, LIST_SEMESTER, PRIMARY_COLOR } from "../../../_constants/common"; |
|
|
|
import { configConstants, PATH } from "../../../_constants"; |
|
|
|
import { configConstants, PATH } from "../../../_constants"; |
|
|
|
import RootSelect from "../../../_components/RootSelect"; |
|
|
|
import RootSelect from "../../../_components/RootSelect"; |
|
|
|
import PrimaryButton from "../../../_components/Button/PrimaryButton"; |
|
|
|
import PrimaryButton from "../../../_components/Button/PrimaryButton"; |
|
|
|
import { useSelector } from "react-redux"; |
|
|
|
import { useDispatch, useSelector } from "react-redux"; |
|
|
|
import './detailRoomEducation.style.scss' |
|
|
|
import './detailRoomEducation.style.scss' |
|
|
|
import BoxDoughnutChart from "../../../_components/boxChart/BoxDoughnutChar"; |
|
|
|
import BoxDoughnutChart from "../../../_components/boxChart/BoxDoughnutChar"; |
|
|
|
import BoxDoughnutBarChart from "../../../_components/boxChart/BoxDoughnutBarChart"; |
|
|
|
import BoxDoughnutBarChart from "../../../_components/boxChart/BoxDoughnutBarChart"; |
|
|
|
import { apiCaller, history } from "../../../_helpers"; |
|
|
|
import { apiCaller, history } from "../../../_helpers"; |
|
|
|
import { replacePathParams } from "../../../_helpers/utils"; |
|
|
|
import { exportExcel, replacePathParams } from "../../../_helpers/utils"; |
|
|
|
import $ from "jquery"; |
|
|
|
import $ from "jquery"; |
|
|
|
import { useParams } from "react-router-dom"; |
|
|
|
import { useLocation, useParams } from "react-router-dom"; |
|
|
|
|
|
|
|
import InputText from "../../../_components/Auth/InputText"; |
|
|
|
|
|
|
|
import { alertActions } from "../../../_actions"; |
|
|
|
|
|
|
|
|
|
|
|
export default function DetailRoomEducation() { |
|
|
|
export default function DetailRoomEducation() { |
|
|
|
const {idRoom} = useParams() |
|
|
|
const {idRoom} = useParams() |
|
|
|
|
|
|
|
const location = useLocation(); |
|
|
|
|
|
|
|
const isBack = location.state?.isBack; |
|
|
|
const grade = useSelector((state) => state.grade); |
|
|
|
const grade = useSelector((state) => state.grade); |
|
|
|
const authentication = useSelector((state) => state.authentication); |
|
|
|
const authentication = useSelector((state) => state.authentication); |
|
|
|
const [dateStudentChart, setDateStudentChart] = useState(new Date()) |
|
|
|
const [dateStudentChart, setDateStudentChart] = useState(new Date()) |
|
|
|
@ -39,6 +43,8 @@ export default function DetailRoomEducation() { |
|
|
|
const [offsetOnline, setOffsetOnline] = useState(0); |
|
|
|
const [offsetOnline, setOffsetOnline] = useState(0); |
|
|
|
const [isEndOnlineClasses, setIsEndOnlineClasses] = useState(false); |
|
|
|
const [isEndOnlineClasses, setIsEndOnlineClasses] = useState(false); |
|
|
|
const [isLoading, setIsLoading] = useState(false); |
|
|
|
const [isLoading, setIsLoading] = useState(false); |
|
|
|
|
|
|
|
const [searchText, setSearchText] = useState(''); |
|
|
|
|
|
|
|
const dispatch = useDispatch(); |
|
|
|
|
|
|
|
|
|
|
|
const getListOrganization = async () => { |
|
|
|
const getListOrganization = async () => { |
|
|
|
try { |
|
|
|
try { |
|
|
|
@ -190,9 +196,15 @@ export default function DetailRoomEducation() { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
const goToDetailSchool = (item) => { |
|
|
|
const goToDetailSchool = (item) => { |
|
|
|
history.push(replacePathParams(PATH.home.detailSchool, {schoolId: item?.organization_id}) + |
|
|
|
const schoolId = item?.organization_id; |
|
|
|
"?school_name=" + |
|
|
|
const schoolName = encodeURIComponent(item?.organization_name); |
|
|
|
encodeURIComponent(item?.organization_name)); |
|
|
|
const detailPath = replacePathParams(PATH.home.detailSchool, { schoolId}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
history.push({ |
|
|
|
|
|
|
|
pathname: detailPath, |
|
|
|
|
|
|
|
search: `?school_name=${schoolName}`, |
|
|
|
|
|
|
|
state: { isBack: true } |
|
|
|
|
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
useEffect(() => { |
|
|
|
@ -279,13 +291,64 @@ export default function DetailRoomEducation() { |
|
|
|
setIsLoading(false); |
|
|
|
setIsLoading(false); |
|
|
|
} |
|
|
|
} |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
const handleExport = () => { |
|
|
|
|
|
|
|
const listHeader = [ |
|
|
|
|
|
|
|
'Stt', |
|
|
|
|
|
|
|
'Tên trường', |
|
|
|
|
|
|
|
'Tiêu chí giao bài', |
|
|
|
|
|
|
|
'Tiêu chí tỷ lệ học sinh làm bài', |
|
|
|
|
|
|
|
'Mức độ hoàn thành tiêu chí', |
|
|
|
|
|
|
|
'Huyện', |
|
|
|
|
|
|
|
'Tỉnh' |
|
|
|
|
|
|
|
];
|
|
|
|
|
|
|
|
const listData = listOrganization.map((item, index) => [ |
|
|
|
|
|
|
|
index + 1, |
|
|
|
|
|
|
|
item.organization_name || '', |
|
|
|
|
|
|
|
item.criteria_level || 0, |
|
|
|
|
|
|
|
item.student_done_per_level || 0, |
|
|
|
|
|
|
|
item.assign_number_level || 0, |
|
|
|
|
|
|
|
item.district || '', |
|
|
|
|
|
|
|
item.province || '', |
|
|
|
|
|
|
|
]); |
|
|
|
|
|
|
|
exportExcel(listHeader, listData, `Danh sách trường.xlsx`); |
|
|
|
|
|
|
|
}; |
|
|
|
|
|
|
|
const getDataTeacher = async () => { |
|
|
|
|
|
|
|
try { |
|
|
|
|
|
|
|
setIsLoading(true); |
|
|
|
|
|
|
|
const endPoint = `/api_teacher/get_teacher_info?search=${searchText}`; |
|
|
|
|
|
|
|
const res = await apiCaller(endPoint, "GET"); |
|
|
|
|
|
|
|
setIsLoading(false); |
|
|
|
|
|
|
|
if (res?.status) { |
|
|
|
|
|
|
|
const teacherId = res?.data?.[0]?.teacher_id; |
|
|
|
|
|
|
|
const teacherName = encodeURIComponent(res?.data?.[0]?.teacher_name); |
|
|
|
|
|
|
|
const detailPath = replacePathParams(PATH.home.detailTeacher, { teacherId}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
history.push({ |
|
|
|
|
|
|
|
pathname: detailPath, |
|
|
|
|
|
|
|
search: `?teacher_name=${teacherName}`, |
|
|
|
|
|
|
|
state: { isBack: true } |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} catch (err) { |
|
|
|
|
|
|
|
setIsLoading(false); |
|
|
|
|
|
|
|
dispatch( |
|
|
|
|
|
|
|
alertActions.error({ |
|
|
|
|
|
|
|
message: err?.toString(), |
|
|
|
|
|
|
|
}), |
|
|
|
|
|
|
|
); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const handleSubmit = () =>{ |
|
|
|
|
|
|
|
getDataTeacher() |
|
|
|
|
|
|
|
} |
|
|
|
return ( |
|
|
|
return ( |
|
|
|
<div className="flex-1"> |
|
|
|
<div className="flex-1"> |
|
|
|
<Header |
|
|
|
<Header |
|
|
|
icon={renderIconHome({ color: "#4D4D4D" })} |
|
|
|
icon={renderIconHome({ color: "#4D4D4D" })} |
|
|
|
title={"Phòng giáo dục " + authentication.user.province} |
|
|
|
title={"Phòng giáo dục " + authentication.user.province} |
|
|
|
manager={true} |
|
|
|
manager={true} |
|
|
|
|
|
|
|
isBack={isBack} |
|
|
|
/> |
|
|
|
/> |
|
|
|
<div className="container-page-header container-page-sidebar"> |
|
|
|
<div className="container-page-header container-page-sidebar"> |
|
|
|
<div className="detail-room-education-container bg-sub-main-green-img"> |
|
|
|
<div className="detail-room-education-container bg-sub-main-green-img"> |
|
|
|
@ -335,7 +398,35 @@ export default function DetailRoomEducation() { |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div className="detail-room-education-right-side"> |
|
|
|
<div className="detail-room-education-right-side"> |
|
|
|
<div className="detail-room-education-list-container"> |
|
|
|
<div className="detail-room-education-list-container"> |
|
|
|
|
|
|
|
<div className="detail-room-education-header"> |
|
|
|
<span style={{fontSize: '2rem', fontWeight: 700, padding: '0 3.2rem'}}>Danh sách trường</span> |
|
|
|
<span style={{fontSize: '2rem', fontWeight: 700, padding: '0 3.2rem'}}>Danh sách trường</span> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div className="d-flex detail-room-education-list-header"> |
|
|
|
|
|
|
|
<InputText |
|
|
|
|
|
|
|
className="criteria-manage-search-input criteria-manage-item" |
|
|
|
|
|
|
|
value={searchText} |
|
|
|
|
|
|
|
setValue={setSearchText} |
|
|
|
|
|
|
|
type="text" |
|
|
|
|
|
|
|
name="searchText" |
|
|
|
|
|
|
|
placeholder={"Nhập email hoặc số điện thoại giáo viên"} |
|
|
|
|
|
|
|
renderLabelIcon={renderIconSearchInput} |
|
|
|
|
|
|
|
onKeyUp={(e) => { |
|
|
|
|
|
|
|
if (e.which == 13 && !isFilterSchool) { |
|
|
|
|
|
|
|
handleSubmit(); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}} |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
<PrimaryButton |
|
|
|
|
|
|
|
isDisabled={false} |
|
|
|
|
|
|
|
onClick={handleSubmit} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
{"Tìm kiếm"} |
|
|
|
|
|
|
|
</PrimaryButton> |
|
|
|
|
|
|
|
<PrimaryButton onClick={handleExport}> |
|
|
|
|
|
|
|
Xuất excel |
|
|
|
|
|
|
|
</PrimaryButton> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
<div className="flex gap-16 align-item-center" style={{padding: '1rem 3.2rem'}}> |
|
|
|
<div className="flex gap-16 align-item-center" style={{padding: '1rem 3.2rem'}}> |
|
|
|
<RootSelect |
|
|
|
<RootSelect |
|
|
|
data={LIST_SCHOOL_YEAR} |
|
|
|
data={LIST_SCHOOL_YEAR} |
|
|
|
|
Quy_FE