yexuejc007/PlayEdu-frontend
1
0
Fork 0
mirror of https://github.com/PlayEdu/frontend.git synced 2025-06-21 14:22:48 +08:00
Code Issues Packages Projects Releases Wiki Activity

课程悬浮优化

Browse Source
This commit is contained in:
禺狨 2023-03-28 18:13:07 +08:00
parent ff5961c277
commit 7f4a08f7a4
2 changed files with 38 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/pages/course/compenents/hour.module.scss
View File

@ -11,6 +11,14 @@
cursor: pointer; cursor: pointer;
&:hover { &:hover {
background: rgba(255, 77, 79, 0.05); background: rgba(255, 77, 79, 0.05);
.left-item {
i {
color: #ff4d4f;
}
.title {
color: #ff4d4f;
}
}
} }
.left-item { .left-item {

78
src/pages/course/compenents/hour.tsx
View File

@ -57,7 +57,7 @@ export const HourCompenent: React.FC<PropInterface> = ({
}; };
return ( return (
<div className={styles["item"]}> <>
<VideoModel <VideoModel
cid={cid} cid={cid}
id={currentId} id={currentId}
@ -73,54 +73,36 @@ export const HourCompenent: React.FC<PropInterface> = ({
goNextVideo(); goNextVideo();
}} }}
></VideoModel> ></VideoModel>
<div className={styles["left-item"]}> <div
<i className="iconfont icon-icon-video"></i> className={styles["item"]}
<div className={styles["title"]}> onClick={() => {
{title}({durationFormat(Number(duration))}) setVisible(true);
}}
>
<div className={styles["left-item"]}>
<i className="iconfont icon-icon-video"></i>
<div className={styles["title"]}>
{title}({durationFormat(Number(duration))})
</div>
</div>
<div className="d-flex">
{progress >= 0 && progress < 100 && (
<>
{progress === 0 && <div className={styles["link"]}>开始学习</div>}
{progress !== 0 && (
<>
<div className={styles["record"]}>
上次学习到
{durationFormat(Number(record.finished_duration || 0))}
</div>
<div className={styles["link"]}>继续学习</div>
</>
)}
</>
)}
{progress >= 100 && <div className={styles["complete"]}>已学完</div>}
</div> </div>
</div> </div>
<div className="d-flex"> </>
{progress >= 0 && progress < 100 && (
<>
{progress === 0 && (
<div
className={styles["link"]}
onClick={() => {
setVisible(true);
}}
>
开始学习
</div>
)}
{progress !== 0 && (
<>
<div className={styles["record"]}>
上次学习到
{durationFormat(Number(record.finished_duration || 0))}
</div>
<div
className={styles["link"]}
onClick={() => {
setVisible(true);
}}
>
继续学习
</div>
</>
)}
</>
)}
{progress >= 100 && (
<div
className={styles["complete"]}
onClick={() => {
setVisible(true);
}}
>
已学完
</div>
)}
</div>
</div>
); );
}; };