training_data/apps/web/src/components/models/course/detail/CourseDetailContext.tsx

115 lines
2.9 KiB
TypeScript
Executable File

import { api, useVisitor } from "@nice/client";
import {
courseDetailSelect,
CourseDto,
Lecture,
lectureDetailSelect,
RolePerms,
VisitType,
} from "@nice/common";
import { useAuth } from "@web/src/providers/auth-provider";
import React, {
createContext,
ReactNode,
useEffect,
useMemo,
useState,
} from "react";
import { useNavigate, useParams } from "react-router-dom";
interface CourseDetailContextType {
editId?: string; // 添加 editId
course?: CourseDto;
lecture?: Lecture;
selectedLectureId?: string | undefined;
setSelectedLectureId?: React.Dispatch<React.SetStateAction<string>>;
isLoading?: boolean;
lectureIsLoading?: boolean;
isHeaderVisible: boolean; // 新增
setIsHeaderVisible: (visible: boolean) => void; // 新增
canEdit?: boolean;
}
interface CourseFormProviderProps {
children: ReactNode;
editId?: string; // 添加 editId 参数
}
export const CourseDetailContext =createContext<CourseDetailContextType | null>(null);
export function CourseDetailProvider({children,editId}: CourseFormProviderProps) {
const navigate = useNavigate();
const { read } = useVisitor();
const { user, hasSomePermissions } = useAuth();
const { lectureId } = useParams();
const { data: course, isLoading }: { data: CourseDto; isLoading: boolean } =
(api.post as any).findFirst.useQuery(
{
where: { id: editId },
// include: {
// // sections: { include: { lectures: true } },
// enrollments: true,
// terms:true
// },
select:courseDetailSelect
},
{ enabled: Boolean(editId) }
);
const canEdit = useMemo(() => {
//先判断登陆再判断是否是作者,三个条件满足一个就有编辑权限
const isAuthor = user?.id === course?.authorId;
const isDept = course?.depts
?.map((dept) => dept.id)
.includes(user?.deptId);
const isRoot = hasSomePermissions(RolePerms?.MANAGE_ANY_POST);
return isAuthor || isDept || isRoot;
}, [user, course]);
const [selectedLectureId, setSelectedLectureId] = useState<
string | undefined
>(lectureId || undefined);
const { data: lecture, isLoading: lectureIsLoading } = (
api.post as any
).findFirst.useQuery(
{
where: { id: selectedLectureId },
select: lectureDetailSelect,
},
{ enabled: Boolean(editId) }
);
useEffect(() => {
if (lecture?.id) {
read.mutateAsync({
data: {
visitorId: user?.id || null,
postId: lecture?.id,
type: VisitType.READED,
},
});
}
}, [course]);
useEffect(() => {
navigate(`/course/${editId}/detail/${selectedLectureId}`);
}, [selectedLectureId, editId]);
const [isHeaderVisible, setIsHeaderVisible] = useState(true); // 新增
return (
<CourseDetailContext.Provider
value={{
editId,
course,
lecture,
selectedLectureId,
setSelectedLectureId,
isLoading,
lectureIsLoading,
isHeaderVisible,
setIsHeaderVisible,
canEdit,
}}>
{children}
</CourseDetailContext.Provider>
);
}