Files
IC-Coder-Plugin/src/views/planToggle.ts
XiaoFeng 2aff54de74 feat: 实现模式选择器 UI
- agentModeSelector 添加下拉菜单和模式切换逻辑
- planToggle 适配新的模式系统
2025-12-30 20:42:19 +08:00

114 lines
2.7 KiB
TypeScript

/**
* Plan 开关组件
* 注意:功能已移至模式选择器,此组件仅保留样式(已禁用)
*/
/**
* 获取 Plan 开关的 HTML 内容
* 已禁用,仅保留样式展示
*/
export function getPlanToggleContent(): string {
return `
<div class="tooltip">
<label class="plan-toggle plan-toggle-disabled">
<input type="checkbox" id="planToggle" disabled>
<span class="plan-toggle-slider"></span>
<span class="plan-toggle-label">Plan</span>
</label>
<span class="tooltiptext" id="planTooltip">请使用模式选择器切换 Plan 模式</span>
</div>
`;
}
/**
* 获取 Plan 开关的样式
*/
export function getPlanToggleStyles(): string {
return `
/* Plan 开关样式 */
.plan-toggle {
display: flex;
align-items: center;
gap: 8px;
cursor: pointer;
user-select: none;
}
.plan-toggle input[type="checkbox"] {
display: none;
}
.plan-toggle-slider {
position: relative;
width: 36px;
height: 20px;
background: var(--vscode-input-background);
border: 1px solid var(--vscode-input-border);
border-radius: 10px;
transition: all 0.3s ease;
}
.plan-toggle-slider::before {
content: "";
position: absolute;
width: 14px;
height: 14px;
left: 2px;
top: 2px;
background: var(--vscode-foreground);
border-radius: 50%;
transition: all 0.3s ease;
}
.plan-toggle input[type="checkbox"]:checked + .plan-toggle-slider {
background: #409eff;
border-color: #409eff;
}
.plan-toggle input[type="checkbox"]:checked + .plan-toggle-slider::before {
transform: translateX(16px);
background: white;
}
.plan-toggle-label {
font-size: 13px;
font-weight: 500;
color: var(--vscode-foreground);
}
/* 禁用状态样式 */
.plan-toggle-disabled {
cursor: not-allowed;
opacity: 0.5;
}
.plan-toggle-disabled .plan-toggle-slider {
background: var(--vscode-input-background);
border-color: var(--vscode-input-border);
}
`;
}
/**
* 获取 Plan 开关的脚本
*/
export function getPlanToggleScript(): string {
return `
// Plan 开关处理函数
function handlePlanToggle() {
const planToggle = document.getElementById('planToggle');
const planTooltip = document.getElementById('planTooltip');
if (planToggle && planTooltip) {
if (planToggle.checked) {
// 开启 Plan 模式
planTooltip.textContent = '关闭 Plan 模式';
} else {
// 关闭 Plan 模式
planTooltip.textContent = '启用 Plan 模式';
}
}
}
`;
}