万朱浩 / Venue-Ops

Go to a project
Toggle navigation Toggle navigation pinning
刘硕
Committed by BaiFu
516f37bd 1 parent b6c5c418

feat: api 隐藏可选 

给api添加了隐藏选项
Inline Side-by-side
Showing 1 changed file with 87 additions and 23 deletions
... ... @@ -83,19 +83,38 @@
}
.config-password-toggle {
padding: 8px 14px;
padding: 8px 12px;
border: 2px solid #000000;
background-color: #ffffff;
cursor: pointer;
font-size: 12px;
font-weight: bold;
font-size: 0;
transition: all 0.3s ease;
display: flex;
align-items: center;
justify-content: center;
min-width: 44px;
min-height: 38px;
}
.config-password-toggle svg {
width: 20px;
height: 20px;
stroke: #000000;
fill: none;
stroke-width: 2;
stroke-linecap: round;
stroke-linejoin: round;
transition: stroke 0.3s ease;
}
.config-password-toggle:hover,
.config-password-toggle.revealed {
background-color: #000000;
color: #ffffff;
}
.config-password-toggle:hover svg,
.config-password-toggle.revealed svg {
stroke: #ffffff;
}
.search-box {
... ... @@ -1163,7 +1182,7 @@
title: 'Insight Agent',
subtitle: '负责洞察分析的模型配置',
fields: [
{ key: 'INSIGHT_ENGINE_API_KEY', label: 'API Key' },
{ key: 'INSIGHT_ENGINE_API_KEY', label: 'API Key', type: 'password' },
{ key: 'INSIGHT_ENGINE_BASE_URL', label: 'Base URL' },
{ key: 'INSIGHT_ENGINE_MODEL_NAME', label: '模型名称' }
]
... ... @@ -1172,7 +1191,7 @@
title: 'Media Agent',
subtitle: '媒体内容理解与生成模型',
fields: [
{ key: 'MEDIA_ENGINE_API_KEY', label: 'API Key' },
{ key: 'MEDIA_ENGINE_API_KEY', label: 'API Key', type: 'password' },
{ key: 'MEDIA_ENGINE_BASE_URL', label: 'Base URL' },
{ key: 'MEDIA_ENGINE_MODEL_NAME', label: '模型名称' }
]
... ... @@ -1181,7 +1200,7 @@
title: 'Query Agent',
subtitle: '负责搜索与信息汇总的模型配置',
fields: [
{ key: 'QUERY_ENGINE_API_KEY', label: 'API Key' },
{ key: 'QUERY_ENGINE_API_KEY', label: 'API Key', type: 'password' },
{ key: 'QUERY_ENGINE_BASE_URL', label: 'Base URL' },
{ key: 'QUERY_ENGINE_MODEL_NAME', label: '模型名称' }
]
... ... @@ -1190,7 +1209,7 @@
title: 'Report Agent',
subtitle: '报告生成使用的模型配置',
fields: [
{ key: 'REPORT_ENGINE_API_KEY', label: 'API Key' },
{ key: 'REPORT_ENGINE_API_KEY', label: 'API Key', type: 'password' },
{ key: 'REPORT_ENGINE_BASE_URL', label: 'Base URL' },
{ key: 'REPORT_ENGINE_MODEL_NAME', label: '模型名称' }
]
... ... @@ -1199,7 +1218,7 @@
title: 'Forum Host',
subtitle: '多智能体协同使用的模型配置',
fields: [
{ key: 'FORUM_HOST_API_KEY', label: 'API Key' },
{ key: 'FORUM_HOST_API_KEY', label: 'API Key', type: 'password' },
{ key: 'FORUM_HOST_BASE_URL', label: 'Base URL' },
{ key: 'FORUM_HOST_MODEL_NAME', label: '模型名称' }
]
... ... @@ -1208,7 +1227,7 @@
title: 'Keyword Optimizer',
subtitle: 'SQL / 关键词优化模型配置',
fields: [
{ key: 'KEYWORD_OPTIMIZER_API_KEY', label: 'API Key' },
{ key: 'KEYWORD_OPTIMIZER_API_KEY', label: 'API Key', type: 'password' },
{ key: 'KEYWORD_OPTIMIZER_BASE_URL', label: 'Base URL' },
{ key: 'KEYWORD_OPTIMIZER_MODEL_NAME', label: '模型名称' }
]
... ... @@ -1217,8 +1236,8 @@
title: '外部检索工具',
subtitle: '联动搜索引擎、网站抓取等在线服务',
fields: [
{ key: 'TAVILY_API_KEY', label: 'Tavily API Key' },
{ key: 'BOCHA_WEB_SEARCH_API_KEY', label: 'Bocha API Key' }
{ key: 'TAVILY_API_KEY', label: 'Tavily API Key', type: 'password' },
{ key: 'BOCHA_WEB_SEARCH_API_KEY', label: 'Bocha API Key', type: 'password' }
]
}
];
... ... @@ -1251,6 +1270,9 @@
checkStatus();
setInterval(checkStatus, 5000);
// 初始化密码切换功能（事件委托，只需调用一次）
attachConfigPasswordToggles();
// 初始化Report Engine锁定状态检查
checkReportLockStatus();
reportLockCheckInterval = setInterval(checkReportLockStatus, 10000); // 每10秒检查一次
... ... @@ -1520,10 +1542,19 @@
autocomplete="off"
>
`;
// 眼睛图标 - 闭眼状态（默认隐藏密码）
const eyeOffIcon = `
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24"></path>
<line x1="1" y1="1" x2="23" y2="23"></line>
</svg>
`;
control = `
<div class="config-password-wrapper">
${inputElement}
<button type="button" class="config-password-toggle" data-target="${field.key}">显示</button>
<button type="button" class="config-password-toggle" data-target="${field.key}" title="显示/隐藏密码">
${eyeOffIcon}
</button>
</div>
`;
} else {
... ... @@ -1562,24 +1593,57 @@
}).join('');
container.innerHTML = sections;
attachConfigPasswordToggles();
// 不再需要每次调用 attachConfigPasswordToggles
// 事件委托已在页面初始化时设置
}
function attachConfigPasswordToggles() {
const toggles = document.querySelectorAll('.config-password-toggle');
toggles.forEach(toggle => {
// 定义眼睛图标的SVG
const eyeOffIcon = `
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24"></path>
<line x1="1" y1="1" x2="23" y2="23"></line>
</svg>
`;
const eyeOnIcon = `
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path>
<circle cx="12" cy="12" r="3"></circle>
</svg>
`;
// 使用事件委托，只在容器上绑定一次事件
const container = document.getElementById('configFormContainer');
if (!container) {
return;
}
// 防止重复绑定
if (container.dataset.passwordToggleAttached === 'true') {
return;
}
container.addEventListener('click', (event) => {
// 查找是否点击了密码切换按钮或其内部的SVG
const toggle = event.target.closest('.config-password-toggle');
if (!toggle) {
return;
}
const key = toggle.dataset.target;
const input = document.querySelector(`.config-field-input[data-config-key="${key}"]`);
const input = container.querySelector(`.config-field-input[data-config-key="${key}"]`);
if (!input) {
return;
}
toggle.addEventListener('click', () => {
const reveal = input.getAttribute('type') === 'password';
input.setAttribute('type', reveal ? 'text' : 'password');
toggle.textContent = reveal ? '隐藏' : '显示';
toggle.classList.toggle('revealed', reveal);
});
const reveal = input.getAttribute('type') === 'password';
input.setAttribute('type', reveal ? 'text' : 'password');
toggle.innerHTML = reveal ? eyeOnIcon : eyeOffIcon;
toggle.classList.toggle('revealed', reveal);
});
// 标记已绑定，防止重复
container.dataset.passwordToggleAttached = 'true';
}
function collectConfigUpdates() {
... ...