<?php
/**
 * HuSNS - 签到排行榜页面
 */
?>
<div class="admin-content signin-page">
    <div class="page-header">
        <h2><i class="fa fa-trophy"></i> 签到排行榜</h2>
        <a href="<?php echo Helper::url('point/signin'); ?>" class="btn btn-default">
            <i class="fa fa-arrow-left"></i> 返回
        </a>
    </div>

    <!-- 排行榜 -->
    <div class="admin-table">
        <table class="table">
            <thead>
                <tr>
                    <th width="80">排名</th>
                    <th>用户</th>
                    <th width="100">签到次数</th>
                    <th width="100">累计积分</th>
                    <th width="160">最近签到</th>
                </tr>
            </thead>
            <tbody>
                <?php if (empty($users)): ?>
                <tr>
                    <td colspan="5">
                        <div class="empty-state">
                            <i class="fa fa-trophy"></i>
                            <p>暂无排行榜数据</p>
                        </div>
                    </td>
                </tr>
                <?php else: ?>
                <?php
                $rank = ($page - 1) * 50 + 1;
                foreach ($users as $user):
                ?>
                <tr>
                    <td>
                        <?php if ($rank <= 3): ?>
                        <span class="rank-badge rank-<?php echo $rank; ?>"><?php echo $rank; ?></span>
                        <?php else: ?>
                        <span class="rank-num"><?php echo $rank; ?></span>
                        <?php endif; ?>
                    </td>
                    <td>
                        <img src="<?php echo $user['avatar'] ? Helper::uploadUrl($user['avatar']) : Helper::assetUrl('images/default-avatar.png'); ?>"
                             alt="" class="avatar-sm">
                        <?php echo htmlspecialchars($user['name']); ?>
                    </td>
                    <td><strong><?php echo $user['signin_count']; ?></strong> 次</td>
                    <td><span class="text-primary"><?php echo $user['total_points']; ?></span></td>
                    <td><?php echo date('Y-m-d H:i', $user['last_signin']); ?></td>
                </tr>
                <?php
                $rank++;
                endforeach;
                ?>
                <?php endif; ?>
            </tbody>
        </table>

        <?php if ($pages > 1): ?>
        <div class="pagination-wrap">
            <ul class="pagination">
                <?php if ($page > 1): ?>
                <li><a href="?r=point/signinLeaderboard&page=<?php echo $page - 1; ?>">«</a></li>
                <?php endif; ?>

                <?php for ($i = max(1, $page - 2); $i <= min($pages, $page + 2); $i++): ?>
                <li><a href="?r=point/signinLeaderboard&page=<?php echo $i; ?>"
                       class="<?php echo $page == $i ? 'active' : ''; ?>"><?php echo $i; ?></a></li>
                <?php endfor; ?>

                <?php if ($page < $pages): ?>
                <li><a href="?r=point/signinLeaderboard&page=<?php echo $page + 1; ?>">»</a></li>
                <?php endif; ?>
            </ul>
        </div>
        <?php endif; ?>
    </div>
</div>

<style>
.signin-page .page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}
.signin-page .page-header h2 {
    margin: 0;
    font-size: 18px;
}
.signin-page .admin-table {
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
}
.signin-page .empty-state {
    text-align: center;
    padding: 40px 20px;
    color: #999;
}
.signin-page .empty-state i {
    font-size: 48px;
    color: #ddd;
    margin-bottom: 10px;
    display: block;
}
.signin-page .avatar-sm {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    margin-right: 10px;
    vertical-align: middle;
}
.signin-page .rank-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    font-weight: bold;
    font-size: 14px;
}
.signin-page .rank-badge.rank-1 {
    background: linear-gradient(135deg, #ffd700, #ffb347);
    color: #fff;
}
.signin-page .rank-badge.rank-2 {
    background: linear-gradient(135deg, #c0c0c0, #a8a8a8);
    color: #fff;
}
.signin-page .rank-badge.rank-3 {
    background: linear-gradient(135deg, #cd7f32, #b87333);
    color: #fff;
}
.signin-page .rank-num {
    color: #888;
}
.signin-page .text-primary {
    color: #3498db;
    font-weight: 600;
}
.signin-page .table th {
    background: #f8f9fa;
}
.signin-page .table td {
    vertical-align: middle;
}
</style>
