上次观看记录跳转

This commit is contained in:
禺狨 2023-03-30 09:50:32 +08:00
parent 0bce18d9e9
commit 9ecff02070
3 changed files with 32 additions and 7 deletions

View File

@ -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<PropInterface> = ({
record,
progress,
totalHours,
records,
onChange,
}) => {
// const navigate = useNavigate();
@ -30,6 +32,7 @@ export const HourCompenent: React.FC<PropInterface> = ({
const [currentId, setCurrentId] = useState(id);
const [currentTitle, setCurrentTitle] = useState(title);
const [isLastpage, setIsLastpage] = useState<boolean>(false);
const [lastSeeDuration, setLastSeeDuration] = useState(0);
useEffect(() => {
getData();
@ -40,6 +43,9 @@ export const HourCompenent: React.FC<PropInterface> = ({
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<PropInterface> = ({
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<PropInterface> = ({
title={currentTitle}
open={visible}
isLastpage={isLastpage}
lastSeeDuration={lastSeeDuration}
onCancel={() => {
setVisible(false);
onChange();

View File

@ -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<PropInterface> = ({
title,
open,
isLastpage,
lastSeeDuration,
onCancel,
goNextVideo,
}) => {
@ -29,27 +31,36 @@ export const VideoModel: React.FC<PropInterface> = ({
const [playUrl, setPlayUrl] = useState<string>("");
const [playDuration, setPlayDuration] = useState(0);
const [playendedStatus, setPlayendedStatus] = useState<Boolean>(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<PropInterface> = ({
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<PropInterface> = ({
<div
className={styles["alert-button"]}
onClick={() => {
setLastSeeValue({});
setPlayendedStatus(false);
goNextVideo();
}}

View File

@ -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}