feat: 优化消息处理和界面显示
- 增强 messageHandler 消息处理逻辑 - 优化 messageArea 显示效果 - 改进 webviewContent 界面交互
This commit is contained in:
@ -306,10 +306,18 @@ async function handleUserMessageWithBackend(
|
|||||||
},
|
},
|
||||||
|
|
||||||
onSegmentUpdate: (segments) => {
|
onSegmentUpdate: (segments) => {
|
||||||
|
// 过滤掉包含 [调用工具:xxx] 的段落
|
||||||
|
const filteredSegments = segments.filter(seg => {
|
||||||
|
if (seg.type === 'text' && typeof seg.content === 'string') {
|
||||||
|
return !/\[调用工具:.+?\]/.test(seg.content);
|
||||||
|
}
|
||||||
|
return true;
|
||||||
|
});
|
||||||
|
|
||||||
// 实时发送段落更新,按后端返回顺序展示
|
// 实时发送段落更新,按后端返回顺序展示
|
||||||
panel.webview.postMessage({
|
panel.webview.postMessage({
|
||||||
command: "updateSegments",
|
command: "updateSegments",
|
||||||
segments: segments,
|
segments: filteredSegments,
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|||||||
@ -382,7 +382,7 @@ export function getMessageAreaStyles(): string {
|
|||||||
}
|
}
|
||||||
/* 低调显示的工具调用 - 移除边距和背景 */
|
/* 低调显示的工具调用 - 移除边距和背景 */
|
||||||
.segment-tool.low-profile {
|
.segment-tool.low-profile {
|
||||||
margin: 5px 0px;
|
margin: 25px 0px;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
background: none;
|
background: none;
|
||||||
}
|
}
|
||||||
@ -549,7 +549,7 @@ export function getMessageAreaStyles(): string {
|
|||||||
max-height: 0;
|
max-height: 0;
|
||||||
}
|
}
|
||||||
.tool-segment-description {
|
.tool-segment-description {
|
||||||
margin: 6px 0 0 0px;
|
margin: 25px 0 0 0px;
|
||||||
font-size: 0.9rem;
|
font-size: 0.9rem;
|
||||||
color: var(--vscode-descriptionForeground);
|
color: var(--vscode-descriptionForeground);
|
||||||
line-height: 1.4;
|
line-height: 1.4;
|
||||||
@ -590,9 +590,9 @@ export function getMessageAreaStyles(): string {
|
|||||||
}
|
}
|
||||||
.segment-question .question-option {
|
.segment-question .question-option {
|
||||||
padding: 8px 16px;
|
padding: 8px 16px;
|
||||||
background: #007ACC;
|
background: #3d3f41;
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
border: 1px solid #007ACC;
|
border: 1px solid #474747;
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition: all 0.2s;
|
transition: all 0.2s;
|
||||||
@ -1211,7 +1211,7 @@ export function getMessageAreaScript(): string {
|
|||||||
|
|
||||||
const optionsHtml = q.options.map(opt => {
|
const optionsHtml = q.options.map(opt => {
|
||||||
const isSelected = selectedAnswers.includes(opt);
|
const isSelected = selectedAnswers.includes(opt);
|
||||||
return \`<label class="question-option\${isSelected ? ' selected' : ''}" style="display:flex;align-items:center;gap:6px;cursor:pointer;padding:4px 0;">
|
return \`<label class="question-option\${isSelected ? ' selected' : ''}" style="display:flex;align-items:center;gap:6px;cursor:pointer;padding:5px 5px 5px 0;">
|
||||||
<input type="\${inputType}" name="\${inputName}" value="\${opt}" \${isSelected ? 'checked' : ''} \${isAnswered ? 'disabled' : ''}>
|
<input type="\${inputType}" name="\${inputName}" value="\${opt}" \${isSelected ? 'checked' : ''} \${isAnswered ? 'disabled' : ''}>
|
||||||
<span>\${opt}</span>
|
<span>\${opt}</span>
|
||||||
</label>\`;
|
</label>\`;
|
||||||
|
|||||||
@ -375,16 +375,32 @@ export function getWebviewContent(
|
|||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
color: var(--vscode-descriptionForeground);
|
color: var(--vscode-descriptionForeground);
|
||||||
}
|
}
|
||||||
|
.status-bar #statusText {
|
||||||
|
background: linear-gradient(90deg,
|
||||||
|
var(--vscode-descriptionForeground) 0%,
|
||||||
|
var(--vscode-foreground) 50%,
|
||||||
|
var(--vscode-descriptionForeground) 100%);
|
||||||
|
background-size: 200% 100%;
|
||||||
|
-webkit-background-clip: text;
|
||||||
|
background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
animation: textShimmer 2s linear infinite;
|
||||||
|
}
|
||||||
|
@keyframes textShimmer {
|
||||||
|
0% { background-position: 200% 0; }
|
||||||
|
100% { background-position: -200% 0; }
|
||||||
|
}
|
||||||
.status-indicator {
|
.status-indicator {
|
||||||
width: 8px;
|
width: 8px;
|
||||||
height: 8px;
|
height: 8px;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
background: var(--vscode-charts-blue);
|
background: var(--vscode-charts-blue);
|
||||||
animation: statusPulse 1.5s ease-in-out infinite;
|
animation: statusPulse 1.5s ease-in-out infinite;
|
||||||
|
box-shadow: 0 0 8px currentColor;
|
||||||
}
|
}
|
||||||
@keyframes statusPulse {
|
@keyframes statusPulse {
|
||||||
0%, 100% { opacity: 1; transform: scale(1); }
|
0%, 100% { opacity: 1; transform: scale(1.2); }
|
||||||
50% { opacity: 0.5; transform: scale(0.8); }
|
50% { opacity: 0.3; transform: scale(0.6); }
|
||||||
}
|
}
|
||||||
.status-bar.working .status-indicator {
|
.status-bar.working .status-indicator {
|
||||||
background: var(--vscode-charts-orange);
|
background: var(--vscode-charts-orange);
|
||||||
|
|||||||
Reference in New Issue
Block a user