fix: 修复助手消息右对齐并补充用户图标
This commit is contained in:
NathanAlex7
@@ -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 包含修复标识、实际访问页面完成刷新。
|
||||
|
||||
@@ -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/, "时效看板操作控件应易于辨认和点击");
|
||||
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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%}}
|
||||
|
||||
Reference in New Issue
Block a user