mirror of
https://github.com/PlayEdu/frontend.git
synced 2025-06-22 00:52:51 +08:00
上次观看记录跳转
This commit is contained in:
parent
0bce18d9e9
commit
9ecff02070
@ -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();
|
||||
|
@ -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();
|
||||
}}
|
||||
|
@ -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}
|
||||
|
Loading…
x
Reference in New Issue
Block a user