5753e120ba
- 在 ICHelperPanel.ts 添加 optimizePrompt 消息处理分支 - 新增 promptOptimizeService.ts 调用后端优化 API - 完善 WebView 端优化按钮交互逻辑
180 lines
9.8 KiB
TypeScript
180 lines
9.8 KiB
TypeScript
/**
|
|
* 一键优化按钮组件
|
|
*/
|
|
|
|
/**
|
|
* 获取一键优化按钮的 HTML 内容
|
|
*/
|
|
export function getOptimizeButtonContent(): string {
|
|
return `
|
|
<!-- 一键优化按钮 -->
|
|
<div class="tooltip">
|
|
<button id="optimizeButton" class="optimize-button" onclick="handleOptimize()">
|
|
<svg t="1765867478136" id="optimizeIcon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2314"><path d="M490.048929 399.773864c7.042381-21.120144 36.85976-21.120144 43.902142 0l41.273372 123.957105A184.967743 184.967743 0 0 0 692.274156 640.713687l123.890111 41.273373c21.119144 7.042381 21.119144 36.85976 0 43.902141L692.207161 767.162574A184.967743 184.967743 0 0 0 575.224443 884.212286l-41.273372 123.890111A23.09997 23.09997 0 0 1 512 1024c-9.983123 0-18.838344-6.409437-21.951071-15.897603L448.775557 884.145292A184.946745 184.946745 0 0 0 331.792839 767.162574L207.836733 725.889201A23.09997 23.09997 0 0 1 191.93813 703.93813c0-9.983123 6.409437-18.838344 15.897603-21.95107l123.957106-41.273373A184.946745 184.946745 0 0 0 448.775557 523.730969zM242.840657 73.466543A13.888779 13.888779 0 0 1 256.022498 63.94338c5.987474 0 11.299007 3.839663 13.182841 9.523163l24.767824 74.360464a111.070238 111.070238 0 0 0 70.19983 70.20083l74.360464 24.767824A13.888779 13.888779 0 0 1 448.05662 255.977502c0 5.987474-3.839663 11.299007-9.523163 13.182841l-74.360464 24.767823a110.947249 110.947249 0 0 0-70.20083 70.199831l-24.767824 74.360464A13.888779 13.888779 0 0 1 256.022498 448.011624a13.888779 13.888779 0 0 1-13.182841-9.523163l-24.767823-74.360464a110.947249 110.947249 0 0 0-70.199831-70.20083l-74.360464-24.767824A13.888779 13.888779 0 0 1 63.988376 255.977502c0-5.987474 3.839663-11.299007 9.523163-13.182841l74.360464-24.767824a110.947249 110.947249 0 0 0 70.20083-70.19983zM695.213897 6.335443a9.283184 9.283184 0 0 1 17.538459 0L729.260905 55.86509a73.889506 73.889506 0 0 0 46.843883 46.843883l49.530646 16.509549a9.283184 9.283184 0 0 1 0 17.538458L776.106787 153.266529a73.9585 73.9585 0 0 0-46.843882 46.843883l-16.509549 49.530647a9.283184 9.283184 0 0 1-17.538459 0L678.705348 200.112412a73.9585 73.9585 0 0 0-46.843883-46.843883l-49.468652-16.509549a9.283184 9.283184 0 0 1 0-17.538458l49.535646-16.509549a73.897505 73.897505 0 0 0 46.842883-46.843883L695.213897 6.397438z m0 0" p-id="2315" fill="#409eff"></path></svg>
|
|
</button>
|
|
<span class="tooltiptext" id="optimizeTooltip">一键优化</span>
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
/**
|
|
* 获取一键优化按钮的样式
|
|
*/
|
|
export function getOptimizeButtonStyles(): string {
|
|
return `
|
|
/* 一键优化按钮样式 */
|
|
.optimize-button {
|
|
padding: 8px;
|
|
background: transparent;
|
|
color: var(--vscode-foreground);
|
|
border: none;
|
|
cursor: pointer;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
transition: opacity 0.2s ease;
|
|
width: 32px;
|
|
height: 32px;
|
|
}
|
|
|
|
.optimize-button:hover {
|
|
opacity: 0.7;
|
|
}
|
|
|
|
.optimize-button svg {
|
|
width: 16px;
|
|
height: 16px;
|
|
}
|
|
|
|
.optimize-button-wrapper {
|
|
display: flex;
|
|
align-items: flex-end;
|
|
}
|
|
`;
|
|
}
|
|
|
|
/**
|
|
* 获取一键优化按钮的脚本
|
|
*/
|
|
export function getOptimizeButtonScript(): string {
|
|
return `
|
|
let isOptimized = false; // 标记是否已优化
|
|
let originalText = ''; // 保存原始文本用于撤回
|
|
let isOptimizing = false; // 标记是否正在优化中
|
|
|
|
function handleOptimize() {
|
|
console.log('[Optimize] handleOptimize 被调用');
|
|
console.log('[Optimize] isOptimizing:', isOptimizing);
|
|
console.log('[Optimize] isOptimized:', isOptimized);
|
|
console.log('[Optimize] messageInput:', messageInput);
|
|
|
|
if (isOptimizing) {
|
|
console.log('[Optimize] 正在优化中，忽略点击');
|
|
return; // 正在优化中，忽略点击
|
|
}
|
|
|
|
if (isOptimized) {
|
|
// 撤回操作
|
|
console.log('[Optimize] 执行撤回操作');
|
|
messageInput.value = originalText;
|
|
resetOptimizeButton();
|
|
} else {
|
|
// 优化操作
|
|
const currentText = messageInput.value.trim();
|
|
console.log('[Optimize] 当前输入内容:', currentText);
|
|
console.log('[Optimize] 内容长度:', currentText.length);
|
|
|
|
if (!currentText) {
|
|
console.log('[Optimize] 输入框为空，不执行优化');
|
|
return; // 输入框为空，不执行优化
|
|
}
|
|
|
|
originalText = messageInput.value; // 保存原始文本
|
|
isOptimizing = true;
|
|
console.log('[Optimize] 开始优化，显示加载状态');
|
|
|
|
// 显示加载状态
|
|
showOptimizeLoading();
|
|
|
|
// 发送优化请求到扩展
|
|
console.log('[Optimize] 发送 optimizePrompt 消息');
|
|
vscode.postMessage({
|
|
command: 'optimizePrompt',
|
|
prompt: currentText
|
|
});
|
|
console.log('[Optimize] postMessage 已发送');
|
|
}
|
|
|
|
messageInput.focus();
|
|
autoResizeTextarea();
|
|
}
|
|
|
|
// 处理优化结果
|
|
function handleOptimizeResult(success, optimizedPrompt, error) {
|
|
isOptimizing = false;
|
|
hideOptimizeLoading();
|
|
|
|
if (success && optimizedPrompt) {
|
|
messageInput.value = optimizedPrompt;
|
|
isOptimized = true;
|
|
updateOptimizeButton();
|
|
} else {
|
|
// 优化失败，恢复原始文本
|
|
messageInput.value = originalText;
|
|
console.error('优化失败:', error);
|
|
}
|
|
|
|
messageInput.focus();
|
|
autoResizeTextarea();
|
|
}
|
|
|
|
function showOptimizeLoading() {
|
|
const optimizeButton = document.getElementById('optimizeButton');
|
|
const optimizeIcon = document.getElementById('optimizeIcon');
|
|
if (optimizeButton && optimizeIcon) {
|
|
optimizeButton.disabled = true;
|
|
optimizeButton.style.opacity = '0.5';
|
|
// 显示加载动画
|
|
optimizeIcon.innerHTML = '<circle cx="512" cy="512" r="400" fill="none" stroke="#409eff" stroke-width="60" stroke-dasharray="1200" stroke-dashoffset="0"><animateTransform attributeName="transform" type="rotate" from="0 512 512" to="360 512 512" dur="1s" repeatCount="indefinite"/></circle>';
|
|
}
|
|
}
|
|
|
|
function hideOptimizeLoading() {
|
|
const optimizeButton = document.getElementById('optimizeButton');
|
|
if (optimizeButton) {
|
|
optimizeButton.disabled = false;
|
|
optimizeButton.style.opacity = '1';
|
|
}
|
|
// 恢复图标会在 updateOptimizeButton 或 resetOptimizeButton 中处理
|
|
if (!isOptimized) {
|
|
resetOptimizeButton();
|
|
}
|
|
}
|
|
|
|
function updateOptimizeButton() {
|
|
const optimizeIcon = document.getElementById('optimizeIcon');
|
|
const optimizeTooltip = document.getElementById('optimizeTooltip');
|
|
|
|
if (optimizeIcon && optimizeTooltip) {
|
|
// 切换为撤回图标
|
|
optimizeIcon.innerHTML = '<path d="M581.056 288.32H232.96l108.352-102.208c15.552-15.744 19.456-31.104 4.16-46.208-16.064-15.872-32.576-15.808-48.64 0l-145.92 144.768c-8.768 8.832-23.488 20.608-22.08 32.448l0.64 4.8-0.64 4.864c-1.344 11.776 6.4 18.24 14.848 26.816l147.648 145.216c16.064 15.808 38.08 20.992 54.144 5.12 15.296-15.104 3.84-38.208-11.328-53.504L233.152 353.6 581.056 352c126.464 0 250.944 111.488 250.944 236.16C832 712.832 707.52 832 581.056 832H246.4c-22.592 0-29.696 9.6-29.696 32.256s7.04 31.744 29.696 31.744H581.12C755.136 896 896 757.696 896 588.16c0-169.408-140.8-299.84-314.944-299.84z" fill="currentColor"/><path d="M323.392 192a32 32 0 1 1 0-64 32 32 0 0 1 0 64zM320.192 514.048a32 32 0 1 1 0-64 32 32 0 0 1 0 64zM237.824 896a32 32 0 1 1 0-64 32 32 0 0 1 0 64z" fill="currentColor"/>';
|
|
optimizeTooltip.textContent = '撤回';
|
|
}
|
|
}
|
|
|
|
function resetOptimizeButton() {
|
|
const optimizeIcon = document.getElementById('optimizeIcon');
|
|
const optimizeTooltip = document.getElementById('optimizeTooltip');
|
|
|
|
if (optimizeIcon && optimizeTooltip) {
|
|
// 切换回优化图标（星星图标）
|
|
optimizeIcon.innerHTML = '<path d="M490.048929 399.773864c7.042381-21.120144 36.85976-21.120144 43.902142 0l41.273372 123.957105A184.967743 184.967743 0 0 0 692.274156 640.713687l123.890111 41.273373c21.119144 7.042381 21.119144 36.85976 0 43.902141L692.207161 767.162574A184.967743 184.967743 0 0 0 575.224443 884.212286l-41.273372 123.890111A23.09997 23.09997 0 0 1 512 1024c-9.983123 0-18.838344-6.409437-21.951071-15.897603L448.775557 884.145292A184.946745 184.946745 0 0 0 331.792839 767.162574L207.836733 725.889201A23.09997 23.09997 0 0 1 191.93813 703.93813c0-9.983123 6.409437-18.838344 15.897603-21.95107l123.957106-41.273373A184.946745 184.946745 0 0 0 448.775557 523.730969zM242.840657 73.466543A13.888779 13.888779 0 0 1 256.022498 63.94338c5.987474 0 11.299007 3.839663 13.182841 9.523163l24.767824 74.360464a111.070238 111.070238 0 0 0 70.19983 70.20083l74.360464 24.767824A13.888779 13.888779 0 0 1 448.05662 255.977502c0 5.987474-3.839663 11.299007-9.523163 13.182841l-74.360464 24.767823a110.947249 110.947249 0 0 0-70.20083 70.199831l-24.767824 74.360464A13.888779 13.888779 0 0 1 256.022498 448.011624a13.888779 13.888779 0 0 1-13.182841-9.523163l-24.767823-74.360464a110.947249 110.947249 0 0 0-70.199831-70.20083l-74.360464-24.767824A13.888779 13.888779 0 0 1 63.988376 255.977502c0-5.987474 3.839663-11.299007 9.523163-13.182841l74.360464-24.767824a110.947249 110.947249 0 0 0 70.20083-70.19983zM695.213897 6.335443a9.283184 9.283184 0 0 1 17.538459 0L729.260905 55.86509a73.889506 73.889506 0 0 0 46.843883 46.843883l49.530646 16.509549a9.283184 9.283184 0 0 1 0 17.538458L776.106787 153.266529a73.9585 73.9585 0 0 0-46.843882 46.843883l-16.509549 49.530647a9.283184 9.283184 0 0 1-17.538459 0L678.705348 200.112412a73.9585 73.9585 0 0 0-46.843883-46.843883l-49.468652-16.509549a9.283184 9.283184 0 0 1 0-17.538458l49.535646-16.509549a73.897505 73.897505 0 0 0 46.842883-46.843883L695.213897 6.397438z m0 0" fill="#409eff"/>';
|
|
optimizeTooltip.textContent = '一键优化';
|
|
}
|
|
|
|
isOptimized = false;
|
|
originalText = '';
|
|
}
|
|
`;
|
|
}
|