调整首页排行榜顺序:每日一练排行榜置于今日排行榜之前
🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
parent
b1551e6deb
commit
fa2964e144
@ -724,6 +724,88 @@ const Home: React.FC = () => {
|
||||
</Row>
|
||||
</div>
|
||||
|
||||
{/* 每日一练排行榜 */}
|
||||
<div className={styles.rankingSection}>
|
||||
<Title level={4} className={styles.sectionTitle}>
|
||||
<CrownOutlined style={{ color: '#fa8c16' }} /> 每日一练排行榜
|
||||
</Title>
|
||||
{dailyExamLoading ? (
|
||||
<Card className={styles.rankingCard} loading={true} />
|
||||
) : dailyExamRanking.rankings.length === 0 ? (
|
||||
<Card className={styles.rankingCard}>
|
||||
<div style={{ textAlign: 'center', padding: '40px 20px', color: '#8c8c8c' }}>
|
||||
<CrownOutlined style={{ fontSize: 48, marginBottom: 16, opacity: 0.3, color: '#fa8c16' }} />
|
||||
<div>今日每日一练尚未生成</div>
|
||||
<div style={{ fontSize: 13, marginTop: 8 }}>请等待系统每天凌晨1点自动生成</div>
|
||||
</div>
|
||||
</Card>
|
||||
) : (
|
||||
<Card className={styles.rankingCard}>
|
||||
{dailyExamRanking.exam_title && (
|
||||
<div style={{
|
||||
padding: '12px 16px',
|
||||
background: 'linear-gradient(135deg, #fff7e6 0%, #ffe7ba 100%)',
|
||||
borderRadius: '8px',
|
||||
marginBottom: '16px',
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
gap: '8px'
|
||||
}}>
|
||||
<FileTextOutlined style={{ color: '#fa8c16', fontSize: 16 }} />
|
||||
<Text strong style={{ color: '#fa8c16' }}>{dailyExamRanking.exam_title}</Text>
|
||||
</div>
|
||||
)}
|
||||
<div className={styles.rankingList}>
|
||||
{dailyExamRanking.rankings.map((user, index) => (
|
||||
<div key={user.user_id} className={styles.rankingItem}>
|
||||
<div className={styles.rankingLeft}>
|
||||
{index < 3 ? (
|
||||
<div className={`${styles.rankBadge} ${styles[`rank${index + 1}`]}`}>
|
||||
{index === 0 && <CrownOutlined />}
|
||||
{index === 1 && <CrownOutlined />}
|
||||
{index === 2 && <CrownOutlined />}
|
||||
</div>
|
||||
) : (
|
||||
<div className={styles.rankNumber}>{index + 1}</div>
|
||||
)}
|
||||
<Avatar
|
||||
src={user.avatar || undefined}
|
||||
size={40}
|
||||
icon={<UserOutlined />}
|
||||
className={styles.rankAvatar}
|
||||
/>
|
||||
<div className={styles.rankUserInfo}>
|
||||
<div className={styles.rankNickname}>{user.nickname}</div>
|
||||
<div className={styles.rankUsername}>@{user.username}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className={styles.rankingRight}>
|
||||
<div className={styles.rankStat}>
|
||||
<div className={styles.rankStatValue} style={{
|
||||
color: user.score >= 80 ? '#52c41a' : user.score >= 60 ? '#faad14' : '#ff4d4f',
|
||||
fontSize: 18,
|
||||
fontWeight: 'bold'
|
||||
}}>
|
||||
{user.score}
|
||||
</div>
|
||||
<div className={styles.rankStatLabel}>得分</div>
|
||||
</div>
|
||||
<div className={styles.rankDivider}></div>
|
||||
<div className={styles.rankStat}>
|
||||
<div className={styles.rankStatValue}>
|
||||
{Math.floor(user.time_spent / 60)}'
|
||||
{user.time_spent % 60 < 10 ? '0' : ''}{user.time_spent % 60}"
|
||||
</div>
|
||||
<div className={styles.rankStatLabel}>用时</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</Card>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* 排行榜 */}
|
||||
<div className={styles.rankingSection}>
|
||||
<Title level={4} className={styles.sectionTitle}>
|
||||
@ -859,88 +941,6 @@ const Home: React.FC = () => {
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* 每日一练排行榜 */}
|
||||
<div className={styles.rankingSection}>
|
||||
<Title level={4} className={styles.sectionTitle}>
|
||||
<CrownOutlined style={{ color: '#fa8c16' }} /> 每日一练排行榜
|
||||
</Title>
|
||||
{dailyExamLoading ? (
|
||||
<Card className={styles.rankingCard} loading={true} />
|
||||
) : dailyExamRanking.rankings.length === 0 ? (
|
||||
<Card className={styles.rankingCard}>
|
||||
<div style={{ textAlign: 'center', padding: '40px 20px', color: '#8c8c8c' }}>
|
||||
<CrownOutlined style={{ fontSize: 48, marginBottom: 16, opacity: 0.3, color: '#fa8c16' }} />
|
||||
<div>今日每日一练尚未生成</div>
|
||||
<div style={{ fontSize: 13, marginTop: 8 }}>请等待系统每天凌晨1点自动生成</div>
|
||||
</div>
|
||||
</Card>
|
||||
) : (
|
||||
<Card className={styles.rankingCard}>
|
||||
{dailyExamRanking.exam_title && (
|
||||
<div style={{
|
||||
padding: '12px 16px',
|
||||
background: 'linear-gradient(135deg, #fff7e6 0%, #ffe7ba 100%)',
|
||||
borderRadius: '8px',
|
||||
marginBottom: '16px',
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
gap: '8px'
|
||||
}}>
|
||||
<FileTextOutlined style={{ color: '#fa8c16', fontSize: 16 }} />
|
||||
<Text strong style={{ color: '#fa8c16' }}>{dailyExamRanking.exam_title}</Text>
|
||||
</div>
|
||||
)}
|
||||
<div className={styles.rankingList}>
|
||||
{dailyExamRanking.rankings.map((user, index) => (
|
||||
<div key={user.user_id} className={styles.rankingItem}>
|
||||
<div className={styles.rankingLeft}>
|
||||
{index < 3 ? (
|
||||
<div className={`${styles.rankBadge} ${styles[`rank${index + 1}`]}`}>
|
||||
{index === 0 && <CrownOutlined />}
|
||||
{index === 1 && <CrownOutlined />}
|
||||
{index === 2 && <CrownOutlined />}
|
||||
</div>
|
||||
) : (
|
||||
<div className={styles.rankNumber}>{index + 1}</div>
|
||||
)}
|
||||
<Avatar
|
||||
src={user.avatar || undefined}
|
||||
size={40}
|
||||
icon={<UserOutlined />}
|
||||
className={styles.rankAvatar}
|
||||
/>
|
||||
<div className={styles.rankUserInfo}>
|
||||
<div className={styles.rankNickname}>{user.nickname}</div>
|
||||
<div className={styles.rankUsername}>@{user.username}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className={styles.rankingRight}>
|
||||
<div className={styles.rankStat}>
|
||||
<div className={styles.rankStatValue} style={{
|
||||
color: user.score >= 80 ? '#52c41a' : user.score >= 60 ? '#faad14' : '#ff4d4f',
|
||||
fontSize: 18,
|
||||
fontWeight: 'bold'
|
||||
}}>
|
||||
{user.score}
|
||||
</div>
|
||||
<div className={styles.rankStatLabel}>得分</div>
|
||||
</div>
|
||||
<div className={styles.rankDivider}></div>
|
||||
<div className={styles.rankStat}>
|
||||
<div className={styles.rankStatValue}>
|
||||
{Math.floor(user.time_spent / 60)}'
|
||||
{user.time_spent % 60 < 10 ? '0' : ''}{user.time_spent % 60}"
|
||||
</div>
|
||||
<div className={styles.rankStatLabel}>用时</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</Card>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* 用户类型补充模态框 */}
|
||||
<Modal
|
||||
title="请选择您的身份类型"
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user