{% extends "base.html" %}

{% block title %}集成工作空间 - 形式化程序规范生成系统{% endblock %}

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

{% block content %}
<div class="workspace-container">
    <!-- 工作空间头部 -->
    <div class="workspace-header">
        <div class="workspace-title">
            <i class="fas fa-th-large"></i>
            <span>集成工作空间</span>
        </div>
        <div class="workspace-info">
            <span class="job-status" id="jobStatus">
                <i class="fas fa-circle text-success"></i> 就绪
            </span>
            <span class="job-id" id="jobId">作业ID: --</span>
        </div>
    </div>

    <!-- 6区域网格布局 -->
    <div class="workspace-grid">
        <!-- 第一行：代码导入 & 解析结果 -->
        <div class="grid-area code-import" id="codeImportArea">
            <div class="area-header">
                <h3><i class="fas fa-upload"></i> 代码导入</h3>
            </div>
            <div class="area-content">
                {% include "components/code_import_area.html" %}
            </div>
        </div>

        <div class="grid-area parsing-results" id="parsingResultsArea">
            <div class="area-header">
                <h3><i class="fas fa-code"></i> 解析结果</h3>
            </div>
            <div class="area-content">
                {% include "components/parsing_results_area.html" %}
            </div>
        </div>

        <!-- 第二行：验证配置 & 实时日志 -->
        <div class="grid-area verification-config" id="verificationConfigArea">
            <div class="area-header">
                <h3><i class="fas fa-cogs"></i> 验证配置</h3>
            </div>
            <div class="area-content">
                {% include "components/verification_config_area.html" %}
            </div>
        </div>

        <div class="grid-area realtime-logs" id="realtimeLogsArea">
            <div class="area-header">
                <h3><i class="fas fa-stream"></i> 实时日志</h3>
            </div>
            <div class="area-content">
                {% include "components/realtime_log_area.html" %}
            </div>
        </div>

        <!-- 第三行：控制面板 & 结果显示 -->
        <div class="grid-area control-panel" id="controlPanelArea">
            <div class="area-header">
                <h3><i class="fas fa-gamepad"></i> 控制面板</h3>
            </div>
            <div class="area-content">
                {% include "components/control_panel_area.html" %}
            </div>
        </div>

        <div class="grid-area results-display" id="resultsDisplayArea">
            <div class="area-header">
                <h3><i class="fas fa-chart-bar"></i> 结果显示</h3>
            </div>
            <div class="area-content">
                {% include "components/results_display_area.html" %}
            </div>
        </div>

        <!-- 评估报告区域（跨越两列） -->
        <div class="grid-area evaluation-report" id="evaluationReportArea">
            <div class="area-header">
                <h3><i class="fas fa-clipboard-check"></i> 评估报告</h3>
            </div>
            <div class="area-content">
                {% include "components/evaluation_report_area.html" %}
            </div>
        </div>
    </div>
</div>

<!-- 工作空间配置引导 -->
<script>
window.WORKSPACE_BOOTSTRAP = {
    wsUrl: "{{ ws_url|default('') }}",
    apiBaseUrl: "{{ api_base_url|default('') }}"
};
</script>
{% endblock %}

{% block extra_js %}
<script src="{{ url_for('static', filename='js/workspace.js') }}"></script>
{% endblock %}