taibai_shopping/app/templates/admin/dashboard.html

{% extends "admin/base.html" %}

{% block title %}仪表板 - 太白购物商城管理后台{% endblock %}

{% block page_title %}仪表板{% endblock %}
{% block page_description %}系统概览和数据统计{% endblock %}

{% block extra_css %}
<link href="{{ url_for('static', filename='css/admin_dashboard.css') }}" rel="stylesheet">
{% endblock %}

{% block content %}
<div class="row dashboard-stats">
    <!-- 统计卡片 -->
    <div class="col-md-3 mb-4">
        <div class="card stats-card">
            <div class="d-flex justify-content-between align-items-center">
                <div>
                    <h3 class="mb-1">{{ stats.total_users or 0 }}</h3>
                    <p class="mb-0">总用户数</p>
                </div>
                <div class="fs-1">
                    <i class="bi bi-people"></i>
                </div>
            </div>
        </div>
    </div>

    <div class="col-md-3 mb-4">
        <div class="card stats-card success">
            <div class="d-flex justify-content-between align-items-center">
                <div>
                    <h3 class="mb-1">{{ stats.active_users or 0 }}</h3>
                    <p class="mb-0">活跃用户</p>
                </div>
                <div class="fs-1">
                    <i class="bi bi-person-check"></i>
                </div>
            </div>
        </div>
    </div>

    <div class="col-md-3 mb-4">
        <div class="card stats-card warning">
            <div class="d-flex justify-content-between align-items-center">
                <div>
                    <h3 class="mb-1">{{ stats.total_admins or 0 }}</h3>
                    <p class="mb-0">管理员数</p>
                </div>
                <div class="fs-1">
                    <i class="bi bi-shield-check"></i>
                </div>
            </div>
        </div>
    </div>

    <div class="col-md-3 mb-4">
        <div class="card stats-card info">
            <div class="d-flex justify-content-between align-items-center">
                <div>
                    <h3 class="mb-1">{{ stats.recent_logs_count or 0 }}</h3>
                    <p class="mb-0">7天操作数</p>
                </div>
                <div class="fs-1">
                    <i class="bi bi-activity"></i>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="row">
    <!-- 用户注册趋势 -->
    <div class="col-md-8 mb-4">
        <div class="card">
            <div class="card-header bg-white">
                <h5 class="mb-0">
                    <i class="bi bi-graph-up"></i>
                    用户注册趋势（最近7天）
                </h5>
            </div>
            <div class="card-body">
                <div class="chart-container">
                    <canvas id="userTrendChart"></canvas>
                </div>
            </div>
        </div>
    </div>

    <!-- 系统状态 -->
    <div class="col-md-4 mb-4">
        <div class="card">
            <div class="card-header bg-white">
                <h5 class="mb-0">
                    <i class="bi bi-info-circle"></i>
                    系统状态
                </h5>
            </div>
            <div class="card-body">
                <div class="system-status-item">
                    <span>数据库连接</span>
                    <span class="badge bg-success">正常</span>
                </div>
                <div class="system-status-item">
                    <span>文件存储</span>
                    <span class="badge bg-success">正常</span>
                </div>
                <div class="system-status-item">
                    <span>邮件服务</span>
                    <span class="badge bg-success">正常</span>
                </div>
                <div class="system-status-item">
                    <span>系统版本</span>
                    <span class="badge bg-info">v1.0.0</span>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- 最近操作日志 -->
<div class="row log-table-container">
    <div class="col-12">
        <div class="card admin-table">
            <div class="card-header bg-white">
                <h5 class="mb-0">
                    <i class="bi bi-journal-text"></i>
                    最近操作日志
                </h5>
            </div>
            <div class="table-responsive">
                <table class="table table-hover mb-0">
                    <thead>
                        <tr>
                            <th>时间</th>
                            <th>操作者</th>
                            <th>操作类型</th>
                            <th>操作内容</th>
                            <th>IP地址</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% if recent_logs %}
                            {% for log in recent_logs %}
                            <tr>
                                <td>{{ log.created_at.strftime('%m-%d %H:%M') if log.created_at else '' }}</td>
                                <td>
                                    {% if log.user_type == 2 %}
                                        <span class="badge bg-warning">管理员</span>
                                    {% else %}
                                        <span class="badge bg-info">用户</span>
                                    {% endif %}
                                    {{ log.user_id }}
                                </td>
                                <td>{{ log.action }}</td>
                                <td>
                                    {% if log.resource_type %}
                                        {{ log.resource_type }}
                                        {% if log.resource_id %}#{{ log.resource_id }}{% endif %}
                                    {% else %}
                                        -
                                    {% endif %}
                                </td>
                                <td>{{ log.ip_address or '-' }}</td>
                            </tr>
                            {% endfor %}
                        {% else %}
                            <tr>
                                <td colspan="5" class="empty-state">
                                    <i class="bi bi-inbox"></i>
                                    <div>暂无操作日志</div>
                                </td>
                            </tr>
                        {% endif %}
                    </tbody>
                </table>
            </div>

            {% if recent_logs %}
            <div class="card-footer bg-white text-center">
                <a href="{{ url_for('admin.logs') }}" class="btn btn-outline-primary btn-sm">
                    查看全部日志 <i class="bi bi-arrow-right"></i>
                </a>
            </div>
            {% endif %}
        </div>
    </div>
</div>
{% endblock %}

{% block extra_js %}
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script>
// Pass data from template to JavaScript
window.userTrendLabels = [
    {% for item in user_trend %}
        '{{ item.date }}'{% if not loop.last %},{% endif %}
    {% endfor %}
];
window.userTrendData = [
    {% for item in user_trend %}
        {{ item.count }}{% if not loop.last %},{% endif %}
    {% endfor %}
];
</script>
<script src="{{ url_for('static', filename='js/admin_dashboard.js') }}"></script>
{% endblock %}