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

feat(ui): 重构注册审核平台原型界面

Browse Source
This commit is contained in:
bruce
2026-06-03 08:41:48 +08:00
parent 77166b5cd3
commit b2c1da3f02
24 changed files with 2563 additions and 536 deletions
Download Patch File Download Diff File Expand all files Collapse all files

136
templates/chat/index.html
View File

@@ -1,6 +1,6 @@
{% extends "base.html" %}
{% block title %}{{ scenario.name|default:"Agent 对话" }}{% endblock %}
{% block title %}{{ scenario.name|default:"Agent 审核工作台" }}{% endblock %}
{% block content %}
{% if error %}
@@ -8,23 +8,25 @@
{% endif %}
{% if scenario %}
<header class="page-header">
<span class="eyebrow">Agent 对话</span>
<section class="page-header">
<span class="eyebrow">Workspace</span>
<h1 class="page-title">{{ scenario.name }}</h1>
<p class="page-lead">{{ scenario.description }}</p>
<ul class="meta-list">
<li class="meta-badge">角色：{{ scenario.agent.role }}</li>
<li class="meta-badge">目标：{{ scenario.agent.goal }}</li>
<li class="meta-badge">已入库文档：{{ document_count }}</li>
<li class="meta-badge">输出类型：{{ scenario.output.type }}</li>
</ul>
</header>
<p class="page-lead">左侧输入问题和选择文档，右侧查看执行结果。</p>
<div class="badge-row">
<span class="pill pill-accent">已入库文档：{{ document_count }}</span>
<span class="pill">输出：{{ scenario.output.type }}</span>
</div>
</section>
<section class="layout-two-columns">
<section class="workspace-grid">
<div class="stack">
<article class="panel">
<h2 class="section-title">提问面板</h2>
<p class="muted">可以直接提问，也可以勾选部分已入库文档作为当前上下文范围。</p>
<div class="section-heading">
<div>
<h2 class="section-title">任务输入与资料范围</h2>
<p class="section-copy">左侧突出受控输入：先描述审核目标，再限定本轮使用的文档范围。</p>
</div>
</div>
<form method="post" class="stack">
{% csrf_token %}
<div>
@@ -36,7 +38,7 @@
</div>
<div>
{{ form.document_ids.label_tag }}
<p class="help-text">不勾选时默认检索当前场景全部已入库文档。</p>
<p class="help-text">不勾选时默认使用全部已入库文档。</p>
<div class="checkbox-list">
{% for checkbox in form.document_ids %}
<label class="checkbox-item">
@@ -51,34 +53,25 @@
<p class="notice notice-error">{{ form.document_ids.errors|join:" " }}</p>
{% endif %}
</div>
<div>
<div class="button-row">
<button type="submit">提交问题并执行 Agent</button>
</div>
</form>
</article>
<article class="panel">
<h2 class="section-title">执行说明</h2>
<h2 class="section-title">快捷示例</h2>
<ul class="detail-list">
<li class="detail-item">
<strong>1. 场景配置</strong>
系统会先读取当前 YAML 场景配置，确定角色、目标、工具和输出结构。
</li>
<li class="detail-item">
<strong>2. RAG 与工具</strong>
如果场景启用了知识库检索，系统会根据你的问题召回相关片段，并执行声明式工具。
</li>
<li class="detail-item">
<strong>3. 结构化结果</strong>
Agent Core 会优先解析 JSON 输出，解析失败时回退为稳定的展示结构。
</li>
<li class="detail-item">检查当前资料是否存在缺失项</li>
<li class="detail-item">抽取说明书中的关键字段</li>
<li class="detail-item">比较两份文档中的产品名称是否一致</li>
</ul>
</article>
</div>
<div class="stack">
<article class="panel">
<h2 class="section-title">回答总览</h2>
<h2 class="section-title">结果</h2>
{% if result %}
<ul class="meta-list">
<li class="meta-badge">模型：{{ result.model_name }}</li>
@@ -89,41 +82,18 @@
<strong>主回答</strong>
<div>{{ result.answer|linebreaksbr }}</div>
</div>
{% if audit_log %}
<p style="margin-top: 14px;">
<a class="button" href="{% url 'audit:detail' audit_log.id %}">查看本次审计日志</a>
</p>
{% endif %}
{% else %}
<div class="notice">提交问题后，这里会展示 Agent 的主回答、模型信息和执行状态。</div>
<div class="notice">提交任务后，这里会展示 Agent 的执行状态、主回答和过程摘要。</div>
{% endif %}
</article>
{% if result %}
<article class="panel">
<h2 class="section-title">结构化结果</h2>
<table class="kv-table">
<tbody>
{% for key, value in result.structured_output.items %}
<tr>
<th>{{ key }}</th>
<td>
{% if key == "answer" or key == "summary" or key == "reply" %}
{{ value|linebreaksbr }}
{% else %}
<pre class="code-block">{{ value }}</pre>
{% endif %}
</td>
</tr>
{% endfor %}
</tbody>
</table>
</article>
<article class="panel">
<h2 class="section-title">引用片段</h2>
<h2 class="section-title">证据引用与工具调用</h2>
<p class="muted" style="margin-bottom: 14px;">引用片段与工具调用用于支撑结果可解释性。</p>
{% if result.references %}
<ul class="detail-list">
<h3 style="margin-top: 0;">引用片段</h3>
<ul class="detail-list" style="margin-bottom: 16px;">
{% for reference in result.references %}
<li class="detail-item">
<strong>{{ reference.source }}</strong>
@@ -132,13 +102,11 @@
{% endfor %}
</ul>
{% else %}
<div class="notice">当前回答没有引用知识库片段。</div>
<div class="notice" style="margin-bottom: 16px;">当前回答没有引用知识库片段。</div>
{% endif %}
</article>
<article class="panel">
<h2 class="section-title">工具调用</h2>
{% if result.tool_calls %}
<h3>工具调用</h3>
<ul class="detail-list">
{% for tool_call in result.tool_calls %}
<li class="detail-item">
@@ -164,6 +132,50 @@
{% endif %}
{% endif %}
</div>
<div class="stack">
<article class="panel">
<div class="section-heading">
<div>
<h2 class="section-title">结构化审核结果</h2>
<p class="section-copy">右侧结果舱用于展示缺失项、冲突项、字段池结果或风险清单。</p>
</div>
</div>
{% if result %}
<table class="kv-table">
<caption style="text-align:left; padding-bottom:12px; color:var(--ink-soft);">结构化结果</caption>
<tbody>
{% for key, value in result.structured_output.items %}
<tr>
<th>{{ key }}</th>
<td>
{% if key == "answer" or key == "summary" or key == "reply" %}
{{ value|linebreaksbr }}
{% else %}
<pre class="code-block">{{ value }}</pre>
{% endif %}
</td>
</tr>
{% endfor %}
</tbody>
</table>
{% else %}
<div class="notice">执行任务后，这里会展示结构化审核结果和回填准备信息。</div>
{% endif %}
</article>
<article class="panel">
<h2 class="section-title">引用与审计</h2>
<ul class="detail-list">
<li class="detail-item">可查看引用片段、工具调用和本次审计日志。</li>
</ul>
{% if audit_log %}
<div class="button-row" style="margin-top: 16px;">
<a class="button" href="{% url 'audit:detail' audit_log.id %}">查看本次审计日志</a>
</div>
{% endif %}
</article>
</div>
</section>
{% endif %}
{% endblock %}