{% extends "base.html" %}

{% block title %}审计日志详情{% endblock %}

{% block content %}
  <section class="page-header">
    <span class="eyebrow">Audit Snapshot</span>
    <h1 class="page-title">审计日志 #{{ log.id }}</h1>
    <p class="page-lead">详情页集中展示当前请求的输入、结构化输出、引用来源、工具调用和原始输出，用来解释这一轮 Agent 执行到底做了什么。</p>
    <div class="button-row">
      <a class="button" href="{% url 'audit:list' %}">返回审计列表</a>
      <a class="button" href="{% url 'platform_ui:command-center' %}">返回工作台大屏</a>
    </div>
  </section>

  <section class="hero-metrics">
    <article class="metric-card">
      <div class="metric-label">场景</div>
      <div class="metric-value">{{ log.scenario_name }}</div>
    </article>
    <article class="metric-card">
      <div class="metric-label">状态</div>
      <div class="metric-value">{{ log.get_status_display_text }}</div>
    </article>
    <article class="metric-card">
      <div class="metric-label">耗时</div>
      <div class="metric-value">{{ log.latency_ms }} ms</div>
    </article>
  </section>

  <section class="layout-two-columns">
    <div class="stack">
      <article class="panel">
        <h2 class="section-title">用户输入</h2>
        <div class="detail-item">{{ log.user_input|linebreaksbr }}</div>
      </article>

      <article class="panel">
        <h2 class="section-title">最终回答</h2>
        <div class="detail-item">{{ log.final_answer|linebreaksbr }}</div>
      </article>

      <article class="panel">
        <h2 class="section-title">结构化输出</h2>
        <pre class="code-block">{{ log.structured_output }}</pre>
      </article>
    </div>

    <div class="stack">
      <article class="panel">
        <h2 class="section-title">引用来源</h2>
        <pre class="code-block">{{ log.retrieved_chunks }}</pre>
      </article>

      <article class="panel">
        <h2 class="section-title">工具调用</h2>
        <pre class="code-block">{{ log.tool_calls }}</pre>
      </article>

      <article class="panel">
        <h2 class="section-title">原始输出</h2>
        <pre class="code-block">{{ log.raw_output }}</pre>
      </article>

      {% if log.error_message %}
        <article class="panel">
          <h2 class="section-title">错误信息</h2>
          <pre class="code-block">{{ log.error_message }}</pre>
        </article>
      {% endif %}
    </div>
  </section>
{% endblock %}