diff --git a/src/constants/toolIcons.ts b/src/constants/toolIcons.ts
index ca881be..8d866f9 100644
--- a/src/constants/toolIcons.ts
+++ b/src/constants/toolIcons.ts
@@ -50,3 +50,23 @@ export const SearchCode = `
`;
+
+/**
+ * 发送按钮图标 SVG（向上箭头）
+ */
+export const sendIconSvg = `
+
+`;
+
+/**
+ * 暂停按钮图标 SVG（圆形边框内的方块）
+ */
+export const stopIconSvg = `
+
+`;
diff --git a/src/views/inputArea.ts b/src/views/inputArea.ts
index 638eb96..a0ec703 100644
--- a/src/views/inputArea.ts
+++ b/src/views/inputArea.ts
@@ -29,6 +29,10 @@ import {
getOptimizeButtonStyles,
getOptimizeButtonScript
} from "./optimizeButton";
+import {
+ sendIconSvg,
+ stopIconSvg
+} from "../constants/toolIcons";
/**
* 获取输入区域的 HTML 内容
@@ -56,7 +60,10 @@ export function getInputAreaContent(): string {
${getContextCompressContent()}
${getOptimizeButtonContent()}
-
+
@@ -221,6 +228,30 @@ export function getInputAreaStyles(): string {
border: none;
border-radius: 4px;
cursor: pointer;
+ transition: background 0.2s ease;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+ button:hover {
+ background: var(--vscode-button-hoverBackground);
+ }
+ /* 发送按钮状态样式 */
+ #sendButton {
+ position: relative;
+ min-width: 32px;
+ padding: 6px 8px;
+ }
+ #sendButton svg {
+ width: 14px;
+ height: 14px;
+ display: block;
+ }
+ #sendButton.sending {
+ background: var(--vscode-button-background);
+ }
+ #sendButton.sending:hover {
+ background: var(--vscode-button-hoverBackground);
}
`;
}
@@ -237,6 +268,9 @@ export function getInputAreaScript(): string {
${getPlanToggleScript()}
${getOptimizeButtonScript()}
+ // 对话状态管理
+ let isConversationActive = false;
+
// 自动调整 textarea 高度
function autoResizeTextarea() {
if (messageInput) {
@@ -256,6 +290,38 @@ export function getInputAreaScript(): string {
messageInput.focus();
}
+ // 切换发送按钮状态
+ function setSendButtonState(isSending) {
+ const sendButton = document.getElementById('sendButton');
+ const children = sendButton.children;
+ const sendIconContainer = children[0]; // 第一个子元素是发送图标的 SVG
+ const stopIconContainer = children[1]; // 第二个子元素是包含暂停图标的 span
+
+ if (isSending) {
+ sendButton.classList.add('sending');
+ sendIconContainer.style.display = 'none';
+ stopIconContainer.style.display = 'block';
+ isConversationActive = true;
+ } else {
+ sendButton.classList.remove('sending');
+ sendIconContainer.style.display = 'block';
+ stopIconContainer.style.display = 'none';
+ isConversationActive = false;
+ }
+ }
+
+ // 处理发送或停止
+ function handleSendOrStop() {
+ if (isConversationActive) {
+ // 当前正在对话，执行停止操作
+ vscode.postMessage({ command: 'abortDialog' });
+ setSendButtonState(false);
+ } else {
+ // 当前未在对话，执行发送操作
+ sendMessage();
+ }
+ }
+
function sendMessage() {
const text = messageInput.value.trim();
if (!text) return;
@@ -264,6 +330,10 @@ export function getInputAreaScript(): string {
const model = getCurrentModel(); // 从模型选择器组件获取当前模型
addMessage(text, 'user');
+
+ // 切换按钮为暂停状态
+ setSendButtonState(true);
+
vscode.postMessage({ command: 'sendMessage', text: text, mode: mode, model: model });
messageInput.value = '';
autoResizeTextarea(); // 重置输入框高度
diff --git a/src/views/webviewContent.ts b/src/views/webviewContent.ts
index f1d2c29..3991909 100644
--- a/src/views/webviewContent.ts
+++ b/src/views/webviewContent.ts
@@ -347,6 +347,27 @@ export function getWebviewContent(iconUri?: string): string {
background: var(--vscode-charts-red);
animation: none;
}
+
+ /* 快捷操作按钮样式 */
+ .quick-actions {
+ display: flex;
+ gap: 10px;
+ margin-bottom: 15px;
+ flex-wrap: wrap;
+ }
+ .quick-btn {
+ padding: 8px 16px;
+ background: var(--vscode-button-secondaryBackground);
+ color: var(--vscode-button-secondaryForeground);
+ border: 1px solid var(--vscode-button-border);
+ border-radius: 6px;
+ cursor: pointer;
+ font-size: 13px;
+ transition: all 0.2s;
+ }
+ .quick-btn:hover {
+ background: var(--vscode-button-secondaryHoverBackground);
+ }
@@ -437,6 +458,10 @@ export function getWebviewContent(iconUri?: string): string {
// 实时更新分段消息（按后端返回顺序）
console.log('[WebView] 实时更新段落, segments:', message.segments);
updateSegmentsRealtime(message.segments, message.isComplete);
+ // 如果对话完成，恢复发送按钮状态
+ if (message.isComplete && typeof setSendButtonState === 'function') {
+ setSendButtonState(false);
+ }
break;
case 'receiveSegments':