zcbot/web/templates/chat.html

70 lines
2.5 KiB
HTML

{% extends "base.html" %}
{% block title %}zcbot · {{ task_id_short }}{% endblock %}
{% block nav %}<a href="/">tasks</a>{% endblock %}
{% block content %}
<div class="page-head">
<h1>task <code class="mono">{{ task_id_short }}</code>
<span class="status status-{{ status }}">{{ status }}</span>
{% if mode %}<span class="badge">{{ mode }}</span>{% endif %}
</h1>
<div class="task-meta muted">
{{ n_messages }} msgs · {{ tokens }} tokens · {{ model_label }}
</div>
</div>
{% if description %}<p class="lead">{{ description }}</p>{% endif %}
{% if task_dir %}<p class="muted mono small">{{ task_dir }}</p>{% endif %}
<section class="chat" id="chat-stream">
{% for b in blocks %}
{% if b.type == "user" %}
<article class="msg msg-user">
<div class="role">user</div>
<div class="body">{{ b.html | safe }}</div>
</article>
{% elif b.type == "assistant" %}
<article class="msg msg-assistant">
<div class="role">assistant</div>
{% if b.html %}<div class="body">{{ b.html | safe }}</div>{% endif %}
{% for tc in b.tool_calls %}
<details class="tool">
<summary>
<span class="tool-badge">tool</span>
<span class="tool-name">{{ tc.name }}</span>
<span class="tool-args-preview">{{ tc.args_preview }}</span>
</summary>
<div class="tool-body">
<div class="tool-section">
<div class="tool-label">args</div>
<pre class="tool-pre">{{ tc.args_pretty }}</pre>
</div>
<div class="tool-section">
<div class="tool-label">result</div>
<pre class="tool-pre">{{ tc.result }}</pre>
</div>
</div>
</details>
{% endfor %}
</article>
{% endif %}
{% endfor %}
</section>
{% if status == "active" %}
<form class="send-form"
hx-post="/tasks/{{ task_id }}/messages"
hx-target="#chat-stream"
hx-swap="beforeend"
hx-on::after-request="if(event.detail.successful) this.reset()">
<textarea name="content" placeholder="发条消息… (Enter 发送,Shift+Enter 换行)"
required rows="2"
onkeydown="if(event.key==='Enter'&&!event.shiftKey){event.preventDefault();this.form.requestSubmit();}"></textarea>
<button type="submit">send</button>
</form>
{% else %}
<p class="muted small mt-1">task 已 {{ status }},不接收新消息。CLI <code>/done</code> 改 status 来恢复。</p>
{% endif %}
<p class="muted small mt-1">G4 流式 ✓ · 文件浏览 = G5 · 打磨 = G6</p>
{% endblock %}