{% extends "base.html" %}

{% block title %}数据预处理模块{% endblock %}

{% block content %}
<section class="hero">
    <h1>数据预处理模块</h1>
    <p>该模块负责扫描本地 CSV，执行字段映射、类型转换、去重更新和质量评分计算，并将清洗后的结果导入数据库。</p>
</section>

<section class="stats">
    <div class="stat-card">
        <div class="label">待处理 CSV 文件数</div>
        <div class="value">{{ file_count }}</div>
    </div>
    <div class="stat-card">
        <div class="label">数据库记录数</div>
        <div class="value">{{ database_stats.total_count|default:0 }}</div>
    </div>
    <div class="stat-card">
        <div class="label">平均 AQI</div>
        <div class="value">{{ database_stats.avg_aqi|default:0|floatformat:2 }}</div>
    </div>
    <div class="stat-card">
        <div class="label">最高 AQI</div>
        <div class="value">{{ database_stats.max_aqi|default:0 }}</div>
    </div>
</section>

<section class="panel">
    <h2>清洗与导入操作</h2>
    <p>执行后会自动读取项目目录中的 CSV 文件，清洗字段后导入数据库。勾选清空旧数据时，会先删除已有空气质量记录。</p>
    <form method="post" style="display:flex;gap:16px;align-items:center;flex-wrap:wrap;">
        {% csrf_token %}
        <label style="display:flex;gap:8px;align-items:center;">
            <input type="checkbox" name="flush" {% if form_data.flush %}checked{% endif %}>
            导入前清空旧数据
        </label>
        <button type="submit" style="padding:10px 18px;border:none;border-radius:12px;background:var(--accent);color:#fff;cursor:pointer;">开始预处理并入库</button>
    </form>
</section>

{% if preprocess_result %}
<section class="stats">
    <div class="stat-card">
        <div class="label">扫描文件数</div>
        <div class="value">{{ preprocess_result.file_count }}</div>
    </div>
    <div class="stat-card">
        <div class="label">删除旧记录</div>
        <div class="value">{{ preprocess_result.deleted_count }}</div>
    </div>
    <div class="stat-card">
        <div class="label">新增记录</div>
        <div class="value">{{ preprocess_result.created_count }}</div>
    </div>
    <div class="stat-card">
        <div class="label">更新记录</div>
        <div class="value">{{ preprocess_result.updated_count }}</div>
    </div>
</section>

<section class="panel">
    <h2>本次参与处理的样例文件</h2>
    <div class="table-wrap">
        <table>
            <thead>
                <tr>
                    <th>文件名</th>
                </tr>
            </thead>
            <tbody>
                {% for item in preprocess_result.sample_files %}
                <tr><td>{{ item }}</td></tr>
                {% empty %}
                <tr><td>本次没有处理文件。</td></tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
</section>
{% endif %}

<section class="panel" style="margin-top:18px;">
    <h2>当前识别到的 CSV 文件样例</h2>
    <p>这里展示当前目录可被预处理模块读取的部分数据文件。</p>
    <div class="table-wrap">
        <table>
            <thead>
                <tr>
                    <th>文件名</th>
                </tr>
            </thead>
            <tbody>
                {% for item in sample_files %}
                <tr><td>{{ item }}</td></tr>
                {% empty %}
                <tr><td>暂无 CSV 文件。</td></tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
</section>
{% endblock %}