{% extends 'base.html' %}
{% load query_helpers %}
{% block title %}手动分析 - 天璇{% endblock %}
{% block content %}
<div class="card">
    <h2>手动分析 - 第 {{ step }} 步 / 共 3 步</h2>
</div>

{% if step == 1 %}
<div class="card">
    <h3>Step 1: 选择数据集</h3>
    <p>选择已上传且预处理完成的数据集：</p>
    {% if runs %}
    <form method="get" action="/analyze/manual/" style="margin-top:1rem;">
        <input type="hidden" name="step" value="2">
        <table>
            <thead><tr><th></th><th>ID</th><th>文件</th><th>行数</th><th>实体列</th><th>状态</th></tr></thead>
            <tbody>
                {% for run in runs %}
                <tr>
                    <td><input type="radio" name="run_id" value="{{ run.id }}" required></td>
                    <td>#{{ run.id }}</td>
                    <td style="max-width:200px;overflow:hidden;text-overflow:ellipsis;">{{ run.csv_glob }}</td>
                    <td>{{ run.total_flows|default:"-" }}</td>
                    <td>{{ run.entity_column|default:"-" }}</td>
                    <td><span class="badge badge-success">{{ run.status }}</span></td>
                </tr>
                {% empty %}
                <tr><td colspan="6" style="text-align:center;">暂无已预处理的数据集。先去 <a href="/upload/">上传页面</a> 上传 CSV。</td></tr>
                {% endfor %}
            </tbody>
        </table>
        <button type="submit" class="btn btn-primary" style="margin-top:1rem;">下一步 →</button>
    </form>
    {% endif %}
</div>
{% endif %}

{% if step == 2 %}
<div class="card">
    <h3>Step 2: 配置聚类参数</h3>
    <form method="get" action="/analyze/manual/">
        <input type="hidden" name="step" value="3">
        <input type="hidden" name="run_id" value="{{ request.GET.run_id }}">
        <div style="margin-bottom:1rem;">
            <label>实体列（entity_columns）：</label>
            <select name="entity_columns" multiple style="width:100%;min-height:100px;">
                {% if entity_candidates %}
                {% for c in entity_candidates %}
                <option value="{{ c.column }}" {% if c.column in selected_entity_cols %}selected{% endif %}>{{ c.column }} (score: {{ c.score }})</option>
                {% endfor %}
                {% elif schema_keys %}
                {% for col in schema_keys %}
                <option value="{{ col }}" {% if col in selected_entity_cols %}selected{% endif %}>{{ col }}</option>
                {% endfor %}
                {% else %}
                <option value="">暂无可选列</option>
                {% endif %}
            </select>
            <small style="color:#666;">按住 Ctrl 多选，留空则使用自动检测结果</small>
        </div>
        <div style="margin-bottom:1rem;">
            <label>特征列（feature_columns）：</label>
            <select name="feature_columns" multiple style="width:100%;min-height:100px;">
                {% if feature_options %}
                {% for opt in feature_options %}
                <option value="{{ opt.name }}">{{ opt.name }} ({{ opt.dtype }})</option>
                {% endfor %}
                {% else %}
                <option value="">暂无可选数值列</option>
                {% endif %}
            </select>
            <small style="color:#666;">按住 Ctrl 多选，留空则自动选择前10个数值列。仅显示数值类型列。</small>
        </div>
        <div style="margin-bottom:1rem;">
            <label>聚类算法：</label>
            <select name="algorithm">
                <option value="hdbscan" {% if default_algo == 'hdbscan' %}selected{% endif %}>HDBSCAN（自动确定簇数）</option>
                <option value="kmeans" {% if default_algo == 'kmeans' %}selected{% endif %}>KMeans（需预设簇数）</option>
            </select>
        </div>
        <div style="margin-bottom:1rem;">
            <label>最小簇大小（min_cluster_size）：</label>
            <input type="number" name="min_cluster_size" value="{{ default_min_size }}" min="2" max="100">
        </div>
        <a href="/analyze/manual/?step=1" class="btn" style="background:#ddd;margin-right:0.5rem;">← 上一步</a>
        <button type="submit" class="btn btn-primary">下一步 →</button>
    </form>
</div>
{% endif %}

{% if step == 3 %}
<div class="card">
    <h3>Step 3: 确认并运行</h3>
    <p>请确认以下配置，确认无误后点击"开始分析"：</p>
    <table>
        <tr><td>数据集 ID</td><td>#{{ request.GET.run_id }}</td></tr>
        <tr><td>实体列</td><td>{{ request.GET|getlist:"entity_columns"|default:"自动检测" }}</td></tr>
        <tr><td>特征列</td><td>{{ request.GET.feature_columns|default:"自动选择" }}</td></tr>
        <tr><td>聚类算法</td><td>{{ request.GET.algorithm }}</td></tr>
        <tr><td>最小簇大小</td><td>{{ request.GET.min_cluster_size }}</td></tr>
    </table>
    <div style="margin-top:1rem;">
        <a href="/analyze/manual/?step=2&run_id={{ request.GET.run_id }}" class="btn" style="background:#ddd;margin-right:0.5rem;">← 上一步</a>
        <button class="btn btn-primary" onclick="runAnalysis()">开始分析</button>
    </div>
    <div id="runProgress" style="display:none;margin-top:1rem;">
        <p>分析进行中... <span id="runStatus"></span></p>
        <div style="background:#eee;height:8px;border-radius:4px;overflow:hidden;">
            <div id="runBar" style="background:#4361ee;height:100%;width:0%;"></div>
        </div>
    </div>
</div>
<script>
async function runAnalysis() {
    document.getElementById('runProgress').style.display = 'block';
    const params = new URLSearchParams(window.location.search);
    const entityCols = params.getAll('entity_columns');
    const featureCols = params.getAll('feature_columns');
    const resp = await fetch('/analyze/run/', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json',
            'X-CSRFToken': '{{ csrf_token }}' },
        body: JSON.stringify({
            run_id: parseInt('{{ request.GET.run_id }}'),
            entity_column: '',
            entity_columns: entityCols.length ? entityCols : undefined,
            feature_columns: featureCols.length ? featureCols : undefined,
            algorithm: '{{ request.GET.algorithm }}',
            min_cluster_size: parseInt('{{ request.GET.min_cluster_size }}'),
        }),
    });
    const data = await resp.json();
    const runId = '{{ request.GET.run_id }}';
    const poll = setInterval(async () => {
        const r = await fetch(`/runs/${runId}/status/`);
        const s = await r.json();
        document.getElementById('runStatus').textContent = s.status;
        if (s.status === 'completed') { clearInterval(poll); window.location.href = `/runs/${runId}/`; }
        if (s.status === 'failed') { clearInterval(poll); document.getElementById('runStatus').textContent = '失败: ' + (s.error_message || ''); }
    }, 1000);
}
</script>
{% endif %}
{% endblock %}