Bruce/DEMO-AGENT
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(frontend): 优化对话与管理页面展示体验

Browse Source
This commit is contained in:
bruce
2026-05-30 00:26:18 +08:00
parent df45a89eb1
commit 905067277a
10 changed files with 776 additions and 218 deletions
Download Patch File Download Diff File Expand all files Collapse all files

91
templates/audit/log_detail.html
View File

@@ -1,37 +1,56 @@
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<title>审计日志详情</title>
</head>
<body>
<h1>审计日志详情 #{{ log.id }}</h1>
<nav><a href="{% url 'audit:list' %}">返回审计列表</a></nav>
<section>
<h2>用户输入</h2>
<p>{{ log.user_input }}</p>
{% extends "base.html" %}
{% block title %}审计日志详情{% endblock %}
{% block content %}
<header class="page-header">
<span class="eyebrow">日志详情</span>
<h1 class="page-title">审计日志 #{{ log.id }}</h1>
<p class="page-lead">这里集中展示当前请求的输入、模型输出、知识库引用和工具调用记录。</p>
<p style="margin-top: 14px;"><a class="button" href="{% url 'audit:list' %}">返回审计列表</a></p>
</header>
<section class="stack">
<article class="panel">
<h2 class="section-title">基础信息</h2>
<ul class="meta-list">
<li class="meta-badge">场景：{{ log.scenario_name }}</li>
<li class="meta-badge">状态：{{ log.status }}</li>
<li class="meta-badge">模型：{{ log.model_name }}</li>
<li class="meta-badge">耗时：{{ log.latency_ms }} ms</li>
</ul>
</article>
<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>
<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>
{% if log.error_message %}
<article class="panel">
<h2 class="section-title">错误信息</h2>
<pre class="code-block">{{ log.error_message }}</pre>
</article>
{% endif %}
</section>
<section>
<h2>最终回答</h2>
<p>{{ log.final_answer }}</p>
</section>
<section>
<h2>结构化输出</h2>
<pre>{{ log.structured_output }}</pre>
</section>
<section>
<h2>引用来源</h2>
<pre>{{ log.retrieved_chunks }}</pre>
</section>
<section>
<h2>工具调用</h2>
<pre>{{ log.tool_calls }}</pre>
</section>
{% if log.error_message %}
<section>
<h2>错误信息</h2>
<pre>{{ log.error_message }}</pre>
</section>
{% endif %}
</body>
</html>
{% endblock %}

73
templates/audit/log_list.html
View File

@@ -1,37 +1,40 @@
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<title>审计日志</title>
</head>
<body>
<h1>审计日志</h1>
<nav><a href="/">返回首页</a></nav>
<table>
<thead>
<tr>
<th>ID</th>
<th>场景</th>
<th>状态</th>
<th>模型</th>
<th>耗时</th>
<th>详情</th>
</tr>
</thead>
<tbody>
{% for log in logs %}
{% extends "base.html" %}
{% block title %}审计日志{% endblock %}
{% block content %}
<header class="page-header">
<span class="eyebrow">执行留痕</span>
<h1 class="page-title">审计日志</h1>
<p class="page-lead">每次 Agent 执行都会记录模型、检索片段、工具调用和最终结果，方便演示链路可解释性。</p>
</header>
<article class="panel">
<table class="kv-table">
<thead>
<tr>
<td>{{ log.id }}</td>
<td>{{ log.scenario_name }}</td>
<td>{{ log.status }}</td>
<td>{{ log.model_name }}</td>
<td>{{ log.latency_ms }} ms</td>
<td><a href="{% url 'audit:detail' log.id %}">查看</a></td>
<th>ID</th>
<th>场景</th>
<th>状态</th>
<th>模型</th>
<th>耗时</th>
<th>详情</th>
</tr>
{% empty %}
<tr><td colspan="6">暂无审计日志。</td></tr>
{% endfor %}
</tbody>
</table>
</body>
</html>
</thead>
<tbody>
{% for log in logs %}
<tr>
<td>{{ log.id }}</td>
<td>{{ log.scenario_name }}</td>
<td>{{ log.status }}</td>
<td>{{ log.model_name }}</td>
<td>{{ log.latency_ms }} ms</td>
<td><a class="button" href="{% url 'audit:detail' log.id %}">查看详情</a></td>
</tr>
{% empty %}
<tr><td colspan="6">暂无审计日志，先去执行一次对话吧。</td></tr>
{% endfor %}
</tbody>
</table>
</article>
{% endblock %}