From 9ecff0207004e739204642111377b13b4a99992f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=A6=BA=E7=8B=A8?= <18119604035@163.com> Date: Thu, 30 Mar 2023 09:50:32 +0800 Subject: [PATCH] =?UTF-8?q?=E4=B8=8A=E6=AC=A1=E8=A7=82=E7=9C=8B=E8=AE=B0?= =?UTF-8?q?=E5=BD=95=E8=B7=B3=E8=BD=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/course/compenents/hour.tsx | 10 ++++++++++ src/pages/course/compenents/video.tsx | 25 ++++++++++++++++++------- src/pages/course/index.tsx | 4 ++++ 3 files changed, 32 insertions(+), 7 deletions(-) diff --git a/src/pages/course/compenents/hour.tsx b/src/pages/course/compenents/hour.tsx index 4deaadd..842ac77 100644 --- a/src/pages/course/compenents/hour.tsx +++ b/src/pages/course/compenents/hour.tsx @@ -12,6 +12,7 @@ interface PropInterface { record: any; progress: number; totalHours: any; + records: any; onChange: () => void; } @@ -23,6 +24,7 @@ export const HourCompenent: React.FC = ({ record, progress, totalHours, + records, onChange, }) => { // const navigate = useNavigate(); @@ -30,6 +32,7 @@ export const HourCompenent: React.FC = ({ const [currentId, setCurrentId] = useState(id); const [currentTitle, setCurrentTitle] = useState(title); const [isLastpage, setIsLastpage] = useState(false); + const [lastSeeDuration, setLastSeeDuration] = useState(0); useEffect(() => { getData(); @@ -40,6 +43,9 @@ export const HourCompenent: React.FC = ({ if (index === totalHours.length - 1) { setIsLastpage(true); } + if (records[totalHours[index].id]) { + setLastSeeDuration(records[totalHours[index].id].finished_duration); + } }; const goNextVideo = () => { @@ -52,6 +58,9 @@ export const HourCompenent: React.FC = ({ if (index + 1 === totalHours.length - 1) { setIsLastpage(true); } + if (records[totalHours[index + 1].id]) { + setLastSeeDuration(records[totalHours[index + 1].id].finished_duration); + } } setVisible(true); }; @@ -64,6 +73,7 @@ export const HourCompenent: React.FC = ({ title={currentTitle} open={visible} isLastpage={isLastpage} + lastSeeDuration={lastSeeDuration} onCancel={() => { setVisible(false); onChange(); diff --git a/src/pages/course/compenents/video.tsx b/src/pages/course/compenents/video.tsx index 778a75a..485c984 100644 --- a/src/pages/course/compenents/video.tsx +++ b/src/pages/course/compenents/video.tsx @@ -12,6 +12,7 @@ interface PropInterface { title: string; open: boolean; isLastpage: boolean; + lastSeeDuration: number; onCancel: () => void; goNextVideo: () => void; } @@ -22,6 +23,7 @@ export const VideoModel: React.FC = ({ title, open, isLastpage, + lastSeeDuration, onCancel, goNextVideo, }) => { @@ -29,27 +31,36 @@ export const VideoModel: React.FC = ({ const [playUrl, setPlayUrl] = useState(""); const [playDuration, setPlayDuration] = useState(0); const [playendedStatus, setPlayendedStatus] = useState(false); + const [lastSeeValue, setLastSeeValue] = useState({}); const myRef = useRef(0); useEffect(() => { + let params = null; if (open) { + if (lastSeeDuration > 0) { + params = { + time: 5, + pos: lastSeeDuration, + }; + setLastSeeValue(params); + } setPlayendedStatus(false); - getVideoUrl(); + getVideoUrl(params); } - }, [open, id, cid]); + }, [open, id, cid, lastSeeDuration]); useEffect(() => { myRef.current = playDuration; }, [playDuration]); - const getVideoUrl = () => { + const getVideoUrl = (params: any) => { course.playUrl(cid, id).then((res: any) => { setPlayUrl(res.data.url); - initDPlayer(res.data.url, 0); + initDPlayer(res.data.url, 0, params); }); }; - const initDPlayer = (playUrl: string, isTrySee: number) => { + const initDPlayer = (playUrl: string, isTrySee: number, params: any) => { window.player = new window.DPlayer({ container: document.getElementById("meedu-player-container"), autoplay: false, @@ -66,9 +77,8 @@ export const VideoModel: React.FC = ({ opacity: Number(systemConfig.playerBulletSecretOpacity), }, ban_drag: false, - last_see_pos: 0, + last_see_pos: params, }); - // 监听播放进度更新evt window.player.on("timeupdate", () => { playTimeUpdate(parseInt(window.player.video.currentTime), false); @@ -121,6 +131,7 @@ export const VideoModel: React.FC = ({
{ + setLastSeeValue({}); setPlayendedStatus(false); goNextVideo(); }} diff --git a/src/pages/course/index.tsx b/src/pages/course/index.tsx index 005013b..bea621e 100644 --- a/src/pages/course/index.tsx +++ b/src/pages/course/index.tsx @@ -136,6 +136,7 @@ const CoursePage = () => { cid={item.course_id} title={item.title} record={learnHourRecord[item.id]} + records={learnHourRecord} duration={item.duration} progress={ (learnHourRecord[item.id].finished_duration * 100) / @@ -151,6 +152,7 @@ const CoursePage = () => { cid={item.course_id} title={item.title} record={null} + records={learnHourRecord} duration={item.duration} progress={0} totalHours={totalHours} @@ -174,6 +176,7 @@ const CoursePage = () => { cid={item.course_id} title={it.title} record={learnHourRecord[it.id]} + records={learnHourRecord} duration={it.duration} progress={ (learnHourRecord[it.id].finished_duration * 100) / @@ -189,6 +192,7 @@ const CoursePage = () => { cid={item.course_id} title={it.title} record={null} + records={learnHourRecord} duration={it.duration} progress={0} totalHours={totalHours}