{% extends "base.html" %}

{% block title %}首页 - 有音个性化教学系统{% endblock %}

{% block content %}
<div class="row g-4 mb-4">
    <div class="col-md-4">
        <div class="card text-center h-100">
            <div class="card-body">
                <i class="bi bi-people text-primary fs-1"></i>
                <h2 class="mt-2">{{ student_count }}</h2>
                <p class="text-muted">学员</p>
                <a href="/students" class="btn btn-outline-primary btn-sm">查看</a>
            </div>
        </div>
    </div>
    <div class="col-md-4">
        <div class="card text-center h-100">
            <div class="card-body">
                <i class="bi bi-collection text-success fs-1"></i>
                <h2 class="mt-2">{{ class_count }}</h2>
                <p class="text-muted">班级</p>
                <a href="/classes" class="btn btn-outline-success btn-sm">查看</a>
            </div>
        </div>
    </div>
    <div class="col-md-4">
        <div class="card text-center h-100">
            <div class="card-body">
                <i class="bi bi-clipboard-check text-warning fs-1"></i>
                <h2 class="mt-2">{{ plan_count }}</h2>
                <p class="text-muted">方案</p>
                <a href="/plans" class="btn btn-outline-warning btn-sm">查看</a>
            </div>
        </div>
    </div>
</div>

<div class="card">
    <div class="card-body text-center py-5">
        <i class="bi bi-music-note-beamed text-muted" style="font-size: 48px;"></i>
        <h4 class="mt-3 text-muted">欢迎使用有音个性化教学系统</h4>
        <p class="text-muted">从左侧菜单选择功能</p>
    </div>
</div>
{% endblock %}