fix: 反馈弹窗将「修改意见」输入框置顶并自动聚焦，确保可见可填写

- 反馈弹窗（feedback）将修改意见 textarea 移至弹窗顶部、紧跟影响范围标题，并加 autoFocus，避免被折叠在弹窗底部
- 提示文案改为引导在上方输入框填写
- 设计文档 8 反馈模态补充说明输入框置顶与自动聚焦

diff --git a/app/page.tsx b/app/page.tsx
index 1ed89431e1b0ea3120ce12d015e33cc7dbfa41d4..5630689186b1eedf9e4381d490fbda85a86b646c 100644 (file)
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -915,4 +915,4 @@ function Modal({type,close,notify,promptData,feedbackCube,refineCube,refining,re
     if(!refineCube){ notify("反馈功能未正确初始化"); return; }
     refineCube(feedbackCube, feedbackText);
   };
-  return <div className="modal-backdrop" onMouseDown={close}><div className="modal" onMouseDown={e=>e.stopPropagation()}><header><h2>{title}</h2><button onClick={close}>×</button></header><div className="modal-body">{type==="feedback"&&<><div className="impact-title">系统已识别本次修改范围（仅针对「{feedbackCube?.name}」页面）</div><ul className="impact-list"><li><b>当前页面 JSON</b><span>将依据修改意见重新生成</span></li><li><b>页面模拟数据</b><span>将同步更新</span></li><li><b>Asset Excel</b><span>不受影响</span></li><li><b>其他 Cube 页面</b><span>不受影响</span></li></ul><Field label="修改意见"><textarea value={feedbackText} onChange={e=>setFeedbackText(e.target.value)} placeholder="例如：顶部增加设备在线率，将告警列表移到页面底部，趋势图改为最近七天。"/></Field><p className="hint">提交后会在当前页面已生成的 JSON 基础上按意见修改，并保留完整提示词（含本次修改意见），可随时通过「提示词」按钮查看。</p>{(refining||refineLog)?<div className="modal-console"><div className="modal-console-head">AI 生成工作流（实时 · 只读）</div><pre className="modal-console-body" ref={refineConsoleRef}>{refineLog||"（等待 AI 反馈…）"}</pre></div>:null}</>}{type==="download"&&<div className="download-list">{["Cube 页面 JSON","站点菜单配置","生成及校验报告"].map(x=><label key={x}><input type="checkbox" defaultChecked/><span>{x}</span></label>)}<div><b>station-package.zip</b><span>包含全部生成产物</span></div></div>}{type==="history"&&<div className="history-list">{[["V1","首次生成",new Date().toLocaleString()]].map((x,i)=><div key={x[0]}><i>{x[0]}</i><span><b>{x[1]}</b><small>{x[2]} · 王宇</small></span><Status>当前版本</Status></div>)}</div>}{type==="prompt"&&<><p className="hint">这是发送给 Cube 生成模型的完整组合提示词。在点击「开始生成」前可在此核对站点上下文、页面要求与 Cube 规则是否准确，便于定位生成质量问题。</p><pre className="prompt-view">{promptData?.text||"（暂无提示词）"}</pre></>}</div><footer><Button secondary onClick={close}>关闭</Button>{type==="feedback"&&<Button disabled={refining} onClick={submitFeedback}>{refining?"重新生成中…":"提交并重新生成"}</Button>}{type==="prompt"&&<Button onClick={()=>{ if(promptData?.text){ navigator.clipboard?.writeText(promptData.text).then(()=>notify("提示词已复制到剪贴板")).catch(()=>notify("复制失败，请手动选择")); } }}>复制提示词</Button>}</footer></div></div>}
+  return <div className="modal-backdrop" onMouseDown={close}><div className="modal" onMouseDown={e=>e.stopPropagation()}><header><h2>{title}</h2><button onClick={close}>×</button></header><div className="modal-body">{type==="feedback"&&<><div className="impact-title">系统已识别本次修改范围（仅针对「{feedbackCube?.name}」页面）</div><Field label="修改意见"><textarea autoFocus value={feedbackText} onChange={e=>setFeedbackText(e.target.value)} placeholder="例如：顶部增加设备在线率，将告警列表移到页面底部，趋势图改为最近七天。"/></Field><p className="hint">在上方输入框填写修改意见，提交后会在当前页面已生成的 JSON 基础上按意见修改，并保留完整提示词（含本次修改意见），可随时通过「提示词」按钮查看。</p><ul className="impact-list"><li><b>当前页面 JSON</b><span>将依据修改意见重新生成</span></li><li><b>页面模拟数据</b><span>将同步更新</span></li><li><b>Asset Excel</b><span>不受影响</span></li><li><b>其他 Cube 页面</b><span>不受影响</span></li></ul>{(refining||refineLog)?<div className="modal-console"><div className="modal-console-head">AI 生成工作流（实时 · 只读）</div><pre className="modal-console-body" ref={refineConsoleRef}>{refineLog||"（等待 AI 反馈…）"}</pre></div>:null}</>}{type==="download"&&<div className="download-list">{["Cube 页面 JSON","站点菜单配置","生成及校验报告"].map(x=><label key={x}><input type="checkbox" defaultChecked/><span>{x}</span></label>)}<div><b>station-package.zip</b><span>包含全部生成产物</span></div></div>}{type==="history"&&<div className="history-list">{[["V1","首次生成",new Date().toLocaleString()]].map((x,i)=><div key={x[0]}><i>{x[0]}</i><span><b>{x[1]}</b><small>{x[2]} · 王宇</small></span><Status>当前版本</Status></div>)}</div>}{type==="prompt"&&<><p className="hint">这是发送给 Cube 生成模型的完整组合提示词。在点击「开始生成」前可在此核对站点上下文、页面要求与 Cube 规则是否准确，便于定位生成质量问题。</p><pre className="prompt-view">{promptData?.text||"（暂无提示词）"}</pre></>}</div><footer><Button secondary onClick={close}>关闭</Button>{type==="feedback"&&<Button disabled={refining} onClick={submitFeedback}>{refining?"重新生成中…":"提交并重新生成"}</Button>}{type==="prompt"&&<Button onClick={()=>{ if(promptData?.text){ navigator.clipboard?.writeText(promptData.text).then(()=>notify("提示词已复制到剪贴板")).catch(()=>notify("复制失败，请手动选择")); } }}>复制提示词</Button>}</footer></div></div>}

diff --git a/public/design-doc.html b/public/design-doc.html
index e64d6d16d002d7ca4237b6cebce2d45c14bb1177..a691291ff6ce1cdd4de11037e3666ad45d77708a 100644 (file)
--- a/public/design-doc.html
+++ b/public/design-doc.html
@@ -316,7 +316,7 @@
   <h2>8. 模态框（Modal）</h2>
   <table>
     <tr><th>类型</th><th>功能</th><th>交互效果</th></tr>
-    <tr><td>æ\8f\90å\87ºä¿®æ\94¹æ\84\8fè§\81ï¼\88feedbackï¼\89</td><td>对å\8d\95页æ\8f\90å\8f\8dé¦\88并é\87\8dæ\96°ç\94\9fæ\88\90</td><td>å±\95示影å\93\8dè\8c\83å\9b´ï¼\88ä»\85å½\93å\89\8d页 / 模æ\8b\9fæ\95°æ\8d® / ä¸\8då\8f\97å½±å\93\8d项ï¼\89ï¼\9bæ\8f\90交å\90\8eã\80\8cä¿®æ\94¹æ\84\8fè§\81ã\80\8dä¸\8bæ\96¹出现黑底白字的 <b>AI 生成工作流</b> 终端，实时滚动 CLI/AI/Skill 进度，完成后自动刷新并关闭</td></tr>
+    <tr><td>æ\8f\90å\87ºä¿®æ\94¹æ\84\8fè§\81ï¼\88feedbackï¼\89</td><td>对å\8d\95页æ\8f\90å\8f\8dé¦\88并é\87\8dæ\96°ç\94\9fæ\88\90</td><td>å¼¹çª\97顶é\83¨å\8d³ã\80\8cä¿®æ\94¹æ\84\8fè§\81ã\80\8dè¾\93å\85¥æ¡\86ï¼\88è\87ªå\8a¨è\81\9aç\84¦ï¼\89ï¼\8cä¸\8bæ\96¹å±\95示影å\93\8dè\8c\83å\9b´ï¼\88ä»\85å½\93å\89\8d页 / 模æ\8b\9fæ\95°æ\8d® / ä¸\8då\8f\97å½±å\93\8d项ï¼\89ï¼\9bæ\8f\90交å\90\8eå¼¹çª\97å\86\85出现黑底白字的 <b>AI 生成工作流</b> 终端，实时滚动 CLI/AI/Skill 进度，完成后自动刷新并关闭</td></tr>
     <tr><td>下载站点交付物（download）</td><td>选择下载项</td><td>列表含 Cube JSON / 菜单配置 / 报告；Asset Excel 占位 <span class="todo">尚未实现</span></td></tr>
     <tr><td>版本历史（history）</td><td>查看版本</td><td>仅展示 V1 当前版本 <span class="todo">真实版本管理尚未实现</span></td></tr>
     <tr><td>生成提示词（prompt）</td><td>查看/复制组合提示词</td><td>展示发送给模型的完整提示词，可复制到剪贴板</td></tr>