SharedClassManager/frontend/student/semester_history.php

<?php
/**
 * 多班级版班级管理系统 - 学生端学期记录页面
 * 
 * 开发者: Canglan
 * 联系方式: admin@sea-studio.top
 * 版权归属: Sea Network Technology Studio
 * 许可证: Apache License 2.0
 * 
 * 版权所有 © Sea Network Technology Studio
 */

require_once __DIR__ . '/../config.php';

// 检查登录状态
if (!isset($_SESSION['user_id']) || $_SESSION['user_type'] !== 'student') {
    header('Location: /index.php');
    exit();
}

$page_title = '学期记录';
$student_id = $_SESSION['student_id'];
include __DIR__ . '/../includes/header.php';
?>

<style>
    .nav .nav-item {
        display: inline-block;
        padding: 8px 16px;
        margin: 0 4px;
        border: none;
        background: none;
        color: #666;
        font-size: 14px;
        cursor: pointer;
        text-decoration: none;
        border-bottom: 2px solid transparent;
    }
    .nav .nav-item.active {
        color: var(--color-primary);
        border-bottom-color: var(--color-primary);
        font-weight: bold;
    }
    .semester-card {
        background: white;
        border-radius: 12px;
        padding: 20px;
        margin-bottom: 16px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    }
    .semester-card-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 12px;
        padding-bottom: 12px;
        border-bottom: 1px solid var(--color-border-light);
    }
    .semester-name {
        font-size: 18px;
        font-weight: bold;
        color: #333;
    }
    .semester-date {
        font-size: 12px;
        color: #999;
    }
    .semester-stats {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 12px;
        text-align: center;
    }
    .semester-stat-item {
        padding: 8px;
    }
    .semester-stat-value {
        font-size: 24px;
        font-weight: bold;
        color: var(--color-primary);
    }
    .semester-stat-label {
        font-size: 12px;
        color: #999;
        margin-top: 4px;
    }
    .empty-state {
        text-align: center;
        padding: 60px 20px;
        color: #999;
    }
    .empty-state-icon {
        font-size: 48px;
        margin-bottom: 16px;
    }
    .archived-badge {
        display: inline-block;
        padding: 2px 8px;
        background: #e8f5e9;
        color: #388e3c;
        border-radius: 10px;
        font-size: 12px;
    }
</style>

<div class="nav">
    <a href="/student/dashboard.php" class="nav-item">首页</a>
    <a href="/student/dashboard.php" class="nav-item">操行分详情</a>
    <a href="/student/dashboard.php" class="nav-item">作业情况</a>
    <a href="/student/dashboard.php" class="nav-item">考勤记录</a>
    <a href="/student/semester_history.php" class="nav-item active">学期记录</a>
    <a href="/student/dashboard.php" class="nav-item">修改密码</a>
</div>

<div class="container">
    <div class="card">
        <div class="card-title">历史学期记录</div>
        <div id="semesterRecords"></div>
    </div>
</div>

<script>
async function loadSemesterRecords() {
    try {
        const res = await apiGet('/api/student/semester-records');
        if (res && res.success) {
            const records = res.data.records || [];
            const container = document.getElementById('semesterRecords');
            
            if (records.length === 0) {
                container.innerHTML = `
                    <div class="empty-state">
                        <div class="empty-state-icon">📋</div>
                        <p>暂无历史学期记录</p>
                        <p style="font-size: 13px; margin-top: 8px;">学期归档后，您的成绩记录将显示在这里</p>
                    </div>
                `;
                return;
            }
            
            let html = '';
            records.forEach(record => {
                const dateRange = record.start_date && record.end_date 
                    ? `${record.start_date} ~ ${record.end_date}` 
                    : '';
                html += `
                    <div class="semester-card">
                        <div class="semester-card-header">
                            <div>
                                <div class="semester-name">${escapeHtml(record.semester_name)}</div>
                                ${dateRange ? `<div class="semester-date">${dateRange}</div>` : ''}
                            </div>
                            <span class="archived-badge">已归档</span>
                        </div>
                        <div class="semester-stats">
                            <div class="semester-stat-item">
                                <div class="semester-stat-value">${record.final_points}</div>
                                <div class="semester-stat-label">最终操行分</div>
                            </div>
                            <div class="semester-stat-item">
                                <div class="semester-stat-value">${record.rank_position || '--'}</div>
                                <div class="semester-stat-label">班级排名</div>
                            </div>
                            <div class="semester-stat-item">
                                <div class="semester-stat-value">${record.total_students || '--'}</div>
                                <div class="semester-stat-label">班级总人数</div>
                            </div>
                        </div>
                        <div style="margin-top: 12px; padding-top: 12px; border-top: 1px solid #eee;">
                            <div style="font-size: 12px; color: #999; margin-bottom: 8px;">考勤统计</div>
                            <div style="display: flex; gap: 8px; flex-wrap: wrap;">
                                <span class="tag tag-success">出勤 ${record.attendance_present || 0}</span>
                                <span class="tag tag-danger">缺勤 ${record.attendance_absent || 0}</span>
                                <span class="tag tag-warning">迟到 ${record.attendance_late || 0}</span>
                                <span class="tag tag-info">请假 ${record.attendance_leave || 0}</span>
                            </div>
                        </div>
                        <div style="margin-top: 8px;">
                            <div style="font-size: 12px; color: #999; margin-bottom: 8px;">作业统计</div>
                            <div style="display: flex; gap: 8px; flex-wrap: wrap;">
                                <span class="tag tag-success">已交 ${record.homework_submitted || 0}</span>
                                <span class="tag tag-danger">未交 ${record.homework_not_submitted || 0}</span>
                                <span class="tag tag-warning">迟交 ${record.homework_late || 0}</span>
                            </div>
                        </div>
                    </div>
                `;
            });
            container.innerHTML = html;
        }
    } catch (error) {
        console.error('加载学期记录失败:', error);
        document.getElementById('semesterRecords').innerHTML = `
            <div class="empty-state">
                <div class="empty-state-icon">⚠️</div>
                <p>加载失败，请稍后重试</p>
            </div>
        `;
    }
}

loadSemesterRecords();
</script>
<script src="/assets/js/student.js"></script>

<?php include __DIR__ . '/../includes/footer.php'; ?>