diff --git a/src/api/user.ts b/src/api/user.ts index 5c29e45..66d4fcd 100644 --- a/src/api/user.ts +++ b/src/api/user.ts @@ -109,6 +109,10 @@ export function learnCourses( }); } +export function learnAllCourses(id: number) { + return client.get(`/backend/v1/user/${id}/all-courses`, {}); +} + export function departmentProgress( id: number, page: number, diff --git a/src/pages/member/index.tsx b/src/pages/member/index.tsx index e08267c..331cf28 100644 --- a/src/pages/member/index.tsx +++ b/src/pages/member/index.tsx @@ -142,7 +142,7 @@ const MemberPage = () => { { let chartRef = useRef(null); const navigate = useNavigate(); const result = new URLSearchParams(useLocation().search); - const [loading, setLoading] = useState(false); - const [page, setPage] = useState(1); - const [size, setSize] = useState(10); - const [list, setList] = useState([]); - const [hours, setHours] = useState({}); - const [total, setTotal] = useState(0); - const [refresh, setRefresh] = useState(false); const [loading2, setLoading2] = useState(false); - const [page2, setPage2] = useState(1); - const [size2, setSize2] = useState(10); const [list2, setList2] = useState([]); const [courses, setCourses] = useState({}); + const [deps, setDeps] = useState([]); + const [depValue, setDepValue] = useState(0); + const [currentCourses, setCurrentCourses] = useState([]); + const [openCourses, setOpenCourses] = useState([]); + const [records, setRecords] = useState({}); const [total2, setTotal2] = useState(0); const [refresh2, setRefresh2] = useState(false); const [uid, setUid] = useState(Number(result.get("id"))); + const [userName, setUserName] = useState(String(result.get("name"))); const [visiable, setVisiable] = useState(false); const [courseId, setcourseId] = useState(0); useEffect(() => { setUid(Number(result.get("id"))); - }, [Number(result.get("id"))]); + setUserName(String(result.get("name"))); + setLoading2(false); + setRefresh2(!refresh2); + }, [result.get("id"), result.get("name")]); useEffect(() => { getZxtData(); @@ -53,12 +53,22 @@ const MemberLearnPage = () => { }, [uid]); useEffect(() => { - getLearnHours(); - }, [refresh, page, size, uid]); + getLearnCourses(); + }, [refresh2, uid]); useEffect(() => { - getLearnCourses(); - }, [refresh2, page2, size2, uid]); + if (depValue === 0) { + return; + } + let arr = courses[depValue]; + let arr2 = openCourses; + if (arr.length > 0) { + var data = arr.concat(arr2); + setCurrentCourses(data); + } else { + setCurrentCourses(arr); + } + }, [depValue]); const getZxtData = () => { member.learnStats(uid).then((res: any) => { @@ -134,56 +144,27 @@ const MemberLearnPage = () => { }; }; - const getLearnHours = () => { - if (loading) { - return; - } - setLoading(true); - member - .learnHours(uid, page, size, { - sort_field: "", - sort_algo: "", - is_finished: "", - }) - .then((res: any) => { - setList(res.data.data); - setHours(res.data.hours); - setTotal(res.data.total); - setLoading(false); - }); - }; - const getLearnCourses = () => { if (loading2) { return; } setLoading2(true); - member - .learnCourses(uid, page2, size2, { - sort_field: "", - sort_algo: "", - is_finished: "", - }) - .then((res: any) => { - setList2(res.data.data); - setCourses(res.data.courses); - setTotal2(res.data.total); - setLoading2(false); + member.learnAllCourses(uid).then((res: any) => { + setList2(res.data.departments); + setCourses(res.data.dep_courses); + setOpenCourses(res.data.open_courses); + setRecords(res.data.user_course_records); + let box: any = []; + res.data.departments.map((item: any) => { + box.push({ + label: item.name, + value: String(item.id), + }); }); - }; - - const paginationProps2 = { - current: page2, //当前页码 - pageSize: size2, - total: total2, // 总条数 - onChange: (page: number, pageSize: number) => - handlePageChange2(page, pageSize), //改变页码的函数 - showSizeChanger: true, - }; - - const handlePageChange2 = (page: number, pageSize: number) => { - setPage2(page); - setSize2(pageSize); + setDepValue(Number(box[0].value)); + setDeps(box); + setLoading2(false); + }); }; const column2: ColumnsType = [ @@ -193,13 +174,13 @@ const MemberLearnPage = () => { render: (_, record: any) => (
- {courses[record.course_id].title} + {record.title}
), }, @@ -209,7 +190,9 @@ const MemberLearnPage = () => { render: (_, record: any) => ( <> - 已完成课时:{record.finished_count} / {record.hour_count} + 已完成课时: + {(records[record.id] && records[record.id].finished_count) || + 0} / {record.class_hour} ), @@ -217,28 +200,56 @@ const MemberLearnPage = () => { { title: "第一次学习时间", dataIndex: "created_at", - render: (text: string) => {dateFormat(text)}, + render: (_, record: any) => ( + <> + {records[record.id] ? ( + {dateFormat(records[record.id].created_at)} + ) : ( + - + )} + + ), }, { title: "学习完成时间", dataIndex: "finished_at", - render: (text: string) => {dateFormat(text)}, + render: (_, record: any) => ( + <> + {records[record.id] ? ( + {dateFormat(records[record.id].finished_at)} + ) : ( + - + )} + + ), }, { title: "学习进度", dataIndex: "is_finished", render: (_, record: any) => ( <> - = - 100 - ? "c-green" - : "c-red" - } - > - {Math.floor((record.finished_count / record.hour_count) * 100)}% - + {records[record.id] ? ( + = 100 + ? "c-green" + : "c-red" + } + > + {Math.floor( + (records[record.id].finished_count / + records[record.id].hour_count) * + 100 + )} + % + + ) : ( + 0% + )} ), }, @@ -252,11 +263,11 @@ const MemberLearnPage = () => { type="link" className="b-link c-red" onClick={() => { - setcourseId(record.course_id); + setcourseId(record.id); setVisiable(true); }} > - 详细 + 明细 ), }, @@ -275,7 +286,7 @@ const MemberLearnPage = () => { }} >
- +
{ >
+ {list2.length > 1 && ( +
+ 切换部门: +