From aec52ecdf6a821629a76a32a68bc527bc796498c Mon Sep 17 00:00:00 2001
From: NathanAlex7 <18898599977@163.com>
Date: Tue, 15 Sep 2026 15:32:41 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E5=8A=A9=E6=89=8B?=
 =?UTF-8?q?=E6=B6=88=E6=81=AF=E5=8F=B3=E5=AF=B9=E9=BD=90=E5=B9=B6=E8=A1=A5?=
 =?UTF-8?q?=E5=85=85=E7=94=A8=E6=88=B7=E5=9B=BE=E6=A0=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 docs/三角色对公业务工作台开发任务-v1.1.md      | 10 ++++++++++
 scripts/test_ui_readability.cjs                |  5 +++++
 src/components/xingbang/BusinessAssistant.tsx  |  4 ++--
 src/components/xingbang/business-assistant.css |  8 ++++++++
 4 files changed, 25 insertions(+), 2 deletions(-)

diff --git a/docs/三角色对公业务工作台开发任务-v1.1.md b/docs/三角色对公业务工作台开发任务-v1.1.md
index 8377e7a..5fcf1be 100644
--- a/docs/三角色对公业务工作台开发任务-v1.1.md
+++ b/docs/三角色对公业务工作台开发任务-v1.1.md
@@ -155,6 +155,7 @@ mini-openclaw 运行（run_id）
 | BUG-010 | “方案比较”没有明确使用价值 | 从客户经理和评审员界面移除该功能，减少无效入口 |
 | BUG-011 | 评审员页面只突出 AI 问题，容易把“AI 未报错”误解为“无需人工评审” | 改为覆盖全部必审事项的节点式三链评审，逐项形成评审员结论 |
 | BUG-012 | 提交成功后仍停留在报告页，用户无法确认项目是否进入评审池 | 提交成功后直接进入项目评审池，高亮刚提交项目并明确显示提交时间和等待状态 |
+| BUG-013 | 业务助手的人类消息多次调整后仍在中间显示，且缺少人类图标 | 用户消息占满独立消息行并强制靠右，右侧显示“本人”头像；发布后必须以云端实际资源验收，不能用本地结果代替 |
 
 ### BUG-009 项目评审池交互约定
 
@@ -185,3 +186,12 @@ mini-openclaw 运行（run_id）
 - 所有必审章节形成明确人工结论后，才允许执行“批准并生成评审报告”；异常项须逐项闭环，正常项允许章节批量确认。仍有未评审章节、待补件或待现场核查事项时，按钮禁用并直接提示缺少哪些确认。
 - 评审报告按相同业务节点汇总数据来源、AI 判断、评审员结论和意见，保证页面与最终报告一一对应。
 - 每次评审判断由服务端自动绑定运行、冻结快照、证据编号、材料定位和 Skill/规则版本；不能由前端自行填写或删改追溯关系。
+
+### BUG-013 业务助手消息对齐与发布验收约定
+
+- 根因一：旧布局只给消息卡片设置最大宽度，用户气泡在该卡片内部仍从左开始，视觉上停在会话区中间。
+- 根因二：前两次修复仅在本地完成，用户实际查看的是阿里云 `3200` 页面；验收环境判断错误，导致“代码已改”与“客户看到已改”不一致。
+- 用户消息必须占据一整行，再由行内容强制右对齐；气泡宽度最多占会话区 75%，窄屏最多占 88%。
+- 用户气泡右侧显示带“本人”语义的人类头像；助手消息继续靠左显示机器人图标，双方身份无需阅读文字即可区分。
+- 回归测试必须同时检查整行右对齐规则、人类头像组件和移动端最大宽度。
+- 涉及客户正在查看的云端缺陷时，完成标准包括：代码验证通过、提交并推送、云端容器健康、云端返回的新 CSS/JS 包含修复标识、实际访问页面完成刷新。
diff --git a/scripts/test_ui_readability.cjs b/scripts/test_ui_readability.cjs
index 55f1e5a..9610281 100644
--- a/scripts/test_ui_readability.cjs
+++ b/scripts/test_ui_readability.cjs
@@ -9,6 +9,7 @@ const globals = read("src/app/globals.css");
 const navigation = read("src/components/xingbang/navigation.css");
 const workspace = read("src/app/data-access/workspace.css");
 const assistant = read("src/components/xingbang/business-assistant.css");
+const assistantComponent = read("src/components/xingbang/BusinessAssistant.tsx");
 const operations = read("src/app/operations-center/operations.css");
 
 assert.match(globals, /font-size:\s*16px/, "全局正文应提供清晰的基础字号");
@@ -20,6 +21,10 @@ assert.match(workspace, /\.ra-button\.primary\{background:#17634c/, "主操作
 assert.match(workspace, /\.xb-review-final>\.ra-button:not\(\.primary\)\{border-color:#d7837b/, "退回操作应与批准操作清楚区分");
 assert.match(workspace, /\.xb-panel>p,.xb-panel p,.xb-panel details\{font-size:14px/, "业务面板正文不应继续使用过小字号");
 assert.match(assistant, /\.ba-messages article p\{font-size:15px/, "助手对话正文应易于阅读");
+assert.match(assistant, /\.ba-messages article\.user\{width:100%;max-width:100%;margin-left:0\}/, "用户消息应占据整行以便贴右显示");
+assert.match(assistant, /\.ba-messages article\.user>div\{width:100%;justify-content:flex-end/, "用户气泡内容应靠右对齐");
+assert.match(assistant, /@media\(max-width:820px\)\{\.ba-messages article\.user p\{max-width:88%\}\}/, "移动端用户气泡应保留可读宽度");
+assert.match(assistantComponent, /className="ba-user-icon" aria-label="本人"><UserRound/, "用户消息应显示清晰的人类图标");
 assert.match(assistant, /\.ba-workspace aside button\{min-height:46px/, "助手快捷操作应有明显点击区域");
 assert.match(operations, /\.td-hero-actions button,.td-hero-actions select\{height:46px/, "时效看板操作控件应易于辨认和点击");
 
diff --git a/src/components/xingbang/BusinessAssistant.tsx b/src/components/xingbang/BusinessAssistant.tsx
index 55228af..4c3c365 100644
--- a/src/components/xingbang/BusinessAssistant.tsx
+++ b/src/components/xingbang/BusinessAssistant.tsx
@@ -1,7 +1,7 @@
 "use client";
 
 import {ChangeEvent,FormEvent,useEffect,useMemo,useState} from "react";
-import {ArrowUpRight,Bot,FilePlus2,MessagesSquare,Paperclip,Send,Sparkles} from "lucide-react";
+import {ArrowUpRight,Bot,FilePlus2,MessagesSquare,Paperclip,Send,Sparkles,UserRound} from "lucide-react";
 import AgentNav from "./AgentNav";
 import IdentitySelector,{ROLE_LABEL} from "./IdentitySelector";
 import ChatPanel from "@/components/chat/ChatPanel";
@@ -53,7 +53,7 @@ export default function BusinessAssistant(){
     <nav className="ba-mode-tabs" aria-label="助手模式"><button className={mode==="business"?"active":""} onClick={()=>setMode("business")}><Sparkles size={15}/>业务快捷助手</button><button className={mode==="openclaw"?"active":""} onClick={()=>setMode("openclaw")}><MessagesSquare size={15}/>mini-openclaw</button></nav>
     <section className="ba-context"><div><span>正在处理</span><select aria-label="选择业务项目" value={projectId} onChange={e=>setProjectId(e.target.value)}>{projects.map(p=><option key={p.id} value={p.id}>{p.id} · {p.customer}</option>)}</select></div>{project&&<><div><span>当前阶段</span><b>{project.stage}</b></div><div><span>下一步</span><b>{project.next_action}</b></div><a href={`/xingbang-workbench?project=${encodeURIComponent(projectId)}`}>进入项目<ArrowUpRight size={15}/></a></>}</section>
     {mode==="business"?<section className="ba-workspace"><aside><Sparkles size={18}/><h2>{ROLE_LABEL[role]}快捷操作</h2><p>{role==="reviewer"?"独立查看材料和历史，再形成评审意见。":role==="admin"?"配置能力与数据边界，不替业务人员作判断。":"补证、预审、成稿、提交，一条主线完成。"}</p>{quick.map(item=><button key={item} disabled={busy||!projectId} onClick={()=>send(item)}>{item}<ArrowUpRight size={14}/></button>)}<small><Bot size={13}/>每次执行都会生成对象编号，可回到项目中追溯。</small></aside>
-      <div className="ba-chat"><div className="ba-messages">{messages.map(message=><article key={message.id} className={message.side}><div>{message.side==="assistant"&&<Bot size={16}/>}<p>{message.text}</p></div>{message.objectId&&<small>操作凭证 · {message.objectId}</small>}{message.url&&<a href={message.url}>查看项目中的结果<ArrowUpRight size={14}/></a>}</article>)}{busy&&<article className="assistant pending"><div><Bot size={16}/><p>正在通过 mini-openclaw 执行并记录…</p></div></article>}</div>
+      <div className="ba-chat"><div className="ba-messages">{messages.map(message=><article key={message.id} className={message.side}><div>{message.side==="assistant"&&<Bot size={16}/>}<p>{message.text}</p>{message.side==="user"&&<span className="ba-user-icon" aria-label="本人"><UserRound size={17}/></span>}</div>{message.objectId&&<small>操作凭证 · {message.objectId}</small>}{message.url&&<a href={message.url}>查看项目中的结果<ArrowUpRight size={14}/></a>}</article>)}{busy&&<article className="assistant pending"><div><Bot size={16}/><p>正在通过 mini-openclaw 执行并记录…</p></div></article>}</div>
         {error&&<div role="alert" className="ba-error">{error}</div>}
         <form onSubmit={submit}><label className="ba-attach" title="补充项目材料"><Paperclip size={18}/><input aria-label="补充项目材料" type="file" accept=".txt,.csv,.docx,.xlsx,.pdf,.png,.jpg,.jpeg" onChange={attach}/></label><input aria-label="业务指令" value={input} onChange={e=>setInput(e.target.value)} placeholder={`例如：查看 ${projectId||"当前项目"} 还缺什么材料`}/><button aria-label="发送业务指令" disabled={busy||!input.trim()||!projectId}><Send size={18}/></button></form><footer><FilePlus2 size={13}/>上传材料只形成待确认候选，不会自动覆盖项目事实。</footer>
       </div>
diff --git a/src/components/xingbang/business-assistant.css b/src/components/xingbang/business-assistant.css
index a844e30..2455356 100644
--- a/src/components/xingbang/business-assistant.css
+++ b/src/components/xingbang/business-assistant.css
@@ -11,3 +11,11 @@
 .ba-workspace aside small{font-size:12px}.ba-messages article p{font-size:15px}.ba-messages article small{font-size:12px}.ba-messages article a{font-size:13px;font-weight:700}
 .ba-error{font-size:14px}.ba-chat form{border-color:#bdd2c6;box-shadow:0 8px 28px #244a3715}.ba-chat form>input{font-size:15px}.ba-chat form>button,.ba-attach{width:44px;height:44px}.ba-chat footer{font-size:12px}
 .ba-native>header b{font-size:14px}.ba-native>header span{font-size:12px}.ba-native>header>a{font-size:13px;font-weight:700}
+
+/* Give operator messages a full row so the bubble cannot drift into the middle. */
+.ba-messages article.user{width:100%;max-width:100%;margin-left:0}
+.ba-messages article.user>div{width:100%;justify-content:flex-end;align-items:flex-start}
+.ba-messages article.user p{max-width:75%}
+.ba-user-icon{width:32px;height:32px;margin-top:7px;display:grid;place-items:center;flex:0 0 32px;border:1px solid #c9ded2;border-radius:50%;background:#edf6f1;color:#17633f}
+.ba-messages article .ba-user-icon svg{margin:0;color:inherit}
+@media(max-width:820px){.ba-messages article.user p{max-width:88%}}