feat(config): 认证令牌输入框支持一键生成随机令牌

- 新增“生成随机令牌”按钮,优化认证令牌输入体验
- 支持自动生成并填充认证令牌,提升交互便捷性
This commit is contained in:
snaily
2025-04-15 23:56:35 +08:00
parent 0693a5c245
commit d1ba2c4ae9
2 changed files with 18 additions and 1 deletions

View File

@@ -187,6 +187,16 @@ document.addEventListener('DOMContentLoaded', function() {
// 移除了静态生成令牌按钮的事件监听器,现在按钮是动态生成的
// 认证令牌生成按钮事件绑定
const generateAuthTokenBtn = document.getElementById('generateAuthTokenBtn');
const authTokenInput = document.getElementById('AUTH_TOKEN');
if (generateAuthTokenBtn && authTokenInput) {
generateAuthTokenBtn.addEventListener('click', function() {
const newToken = generateRandomToken();
authTokenInput.value = newToken;
showNotification('已生成新认证令牌', 'success');
});
}
}); // <-- DOMContentLoaded 结束括号
// 初始化配置

View File

@@ -136,7 +136,14 @@
<!-- 认证令牌 -->
<div class="mb-6">
<label for="AUTH_TOKEN" class="block font-semibold mb-2 text-gray-700">认证令牌</label>
<input type="text" id="AUTH_TOKEN" name="AUTH_TOKEN" placeholder="默认使用ALLOWED_TOKENS中的第一个" class="w-full px-4 py-3 rounded-lg border border-gray-300 focus:border-primary-500 focus:ring focus:ring-primary-200 focus:ring-opacity-50">
<div class="flex items-center">
<div class="flex items-center flex-grow border border-gray-300 rounded-md focus-within:border-primary-500 focus-within:ring focus-within:ring-primary-200 focus-within:ring-opacity-50">
<input type="text" id="AUTH_TOKEN" name="AUTH_TOKEN" placeholder="默认使用ALLOWED_TOKENS中的第一个" class="array-input flex-grow px-3 py-2 border-none rounded-l-md focus:outline-none">
<button type="button" id="generateAuthTokenBtn" class="generate-btn px-2 py-2 text-gray-500 hover:text-primary-600 focus:outline-none rounded-r-md bg-gray-100 hover:bg-gray-200 transition-colors" title="生成随机令牌">
<i class="fas fa-dice"></i>
</button>
</div>
</div>
<small class="text-gray-500 mt-1 block">用于API认证的令牌</small>
</div>