yexuejc007/PlayEdu-frontend
1
0
Fork 0
mirror of https://github.com/PlayEdu/frontend.git synced 2025-09-10 22:23:29 +08:00
Code Issues Packages Projects Releases Wiki Activity

首页优化

Browse Source
This commit is contained in:
禺狨 2023-03-27 18:00:38 +08:00
parent b681c24fe3
commit 2ab98305b3
4 changed files with 75 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/pages/course/index.module.scss
View File

@ -76,7 +76,8 @@
} }
.desc { .desc {
width: 100%; width: 100%;
height: 112px; height: auto;
max-height: 112px;
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
color: rgba(0, 0, 0, 0.6); color: rgba(0, 0, 0, 0.6);

1
src/pages/index/index.module.scss
View File

@ -112,6 +112,7 @@
gap: 24px; gap: 24px;
grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-columns: repeat(3, minmax(0, 1fr));
position: relative; position: relative;
min-height: 301px;
} }
.extra { .extra {

101
src/pages/index/index.tsx
View File

@ -114,14 +114,14 @@ const IndexPage = () => {
<div className={styles["info"]}> <div className={styles["info"]}>
<div className={styles["info-item"]}> <div className={styles["info-item"]}>
<span>必修课：已完成</span> <span>必修课：已完成</span>
<strong> {stats.required_finished_hour_count} </strong> <strong> {stats.required_finished_hour_count || 0} </strong>
<span>/ {stats.required_hour_count}</span> <span>/ {stats.required_hour_count || 0}</span>
</div> </div>
{stats.nun_required_hour_count > 0 && ( {stats.nun_required_hour_count > 0 && (
<div className={styles["info-item"]}> <div className={styles["info-item"]}>
<span>选修课：已完成</span> <span>选修课：已完成</span>
<strong> {stats.nun_required_finished_hour_count} </strong> <strong> {stats.nun_required_finished_hour_count || 0} </strong>
<span>/ {stats.nun_required_hour_count}</span> <span>/ {stats.nun_required_hour_count || 0}</span>
</div> </div>
)} )}
</div> </div>
@ -138,37 +138,61 @@ const IndexPage = () => {
<> <>
<strong> <strong>
{" "} {" "}
{studyTimeFormat(stats.today_learn_duration)[0]}{" "} {studyTimeFormat(stats.today_learn_duration)[0] || 0}{" "}
</strong> </strong>
天 天
</> </>
)} )}
<strong> {studyTimeFormat(stats.today_learn_duration)[1] !== 0 && (
{" "}
{studyTimeFormat(stats.today_learn_duration)[1]}{" "}
</strong>
小时
<strong>
{" "}
{studyTimeFormat(stats.today_learn_duration)[2]}{" "}
</strong>
分钟
</div>
<div className={styles["info-item"]}>
累计：
{studyTimeFormat(stats.learn_duration)[0] !== 0 && (
<> <>
<strong> <strong>
{" "} {" "}
{studyTimeFormat(stats.learn_duration || 0)[0]}{" "} {studyTimeFormat(stats.today_learn_duration)[1] || 0}{" "}
</strong>
小时
</>
)}
<strong>
{" "}
{studyTimeFormat(stats.today_learn_duration)[2] || 0}{" "}
</strong>
分钟
<strong>
{" "}
{studyTimeFormat(stats.today_learn_duration)[3] || 0}{" "}
</strong>
秒
</div>
<div className={styles["info-item"]}>
累计：
{studyTimeFormat(stats.learn_duration || 0)[0] !== 0 && (
<>
<strong>
{" "}
{studyTimeFormat(stats.learn_duration || 0)[0] || 0}{" "}
</strong> </strong>
天 天
</> </>
)} )}
<strong> {studyTimeFormat(stats.learn_duration || 0)[1]} </strong> {studyTimeFormat(stats.learn_duration || 0)[1] !== 0 && (
小时 <>
<strong> {studyTimeFormat(stats.learn_duration || 0)[2]} </strong> <strong>
{" "}
{studyTimeFormat(stats.learn_duration || 0)[1] || 0}{" "}
</strong>
小时
</>
)}
<strong>
{" "}
{studyTimeFormat(stats.learn_duration || 0)[2] || 0}{" "}
</strong>
分钟 分钟
<strong>
{" "}
{studyTimeFormat(stats.learn_duration || 0)[3] || 0}{" "}
</strong>
秒
</div> </div>
</div> </div>
</div> </div>
@ -200,19 +224,36 @@ const IndexPage = () => {
))} ))}
{/* <Tabs defaultActiveKey="0" items={items} onChange={onChange} /> */} {/* <Tabs defaultActiveKey="0" items={items} onChange={onChange} /> */}
</div> </div>
<Row style={{ width: 1200, margin: "0 auto", paddingTop: 14 }}> {loading && (
{loading && ( <Row
style={{
width: 1200,
margin: "0 auto",
paddingTop: 14,
minHeight: 301,
}}
>
<div className="float-left d-j-flex mt-50"> <div className="float-left d-j-flex mt-50">
<Spin size="large" /> <Spin size="large" />
</div> </div>
)} </Row>
{coursesList.length === 0 && ( )}
{!loading && coursesList.length === 0 && (
<Row
style={{
width: 1200,
margin: "0 auto",
paddingTop: 14,
minHeight: 301,
}}
>
<Col span={24}> <Col span={24}>
<Empty description="暂无课程" /> <Empty description="暂无课程" />
</Col> </Col>
)} </Row>
</Row> )}
{coursesList.length > 0 && ( {!loading && coursesList.length > 0 && (
<div className={styles["courses-list"]}> <div className={styles["courses-list"]}>
{coursesList.map((item: any) => ( {coursesList.map((item: any) => (
<div key={item.id}> <div key={item.id}>

1
src/utils/index.ts
View File

@ -31,6 +31,7 @@ export function studyTimeFormat(dateStr: number) {
value.push(Math.floor(d.asDays())); value.push(Math.floor(d.asDays()));
value.push(d.hours()); value.push(d.hours());
value.push(d.minutes()); value.push(d.minutes());
value.push(d.seconds());
return value; return value;
} }