diff --git a/scripts/douyin-browser-capture/control_panel.mjs b/scripts/douyin-browser-capture/control_panel.mjs
index ef91a3d..ea7be77 100644
--- a/scripts/douyin-browser-capture/control_panel.mjs
+++ b/scripts/douyin-browser-capture/control_panel.mjs
@@ -414,6 +414,46 @@ function renderPage() {
color: var(--ink);
}
textarea { min-height: 88px; resize: vertical; }
+ .field-note {
+ font-size: 12px;
+ color: rgba(74, 96, 107, 0.9);
+ line-height: 1.5;
+ }
+ .advanced-box {
+ border: 1px solid rgba(22, 49, 61, 0.12);
+ border-radius: 16px;
+ background: rgba(255, 255, 255, 0.66);
+ padding: 0 14px;
+ }
+ .advanced-box[open] {
+ padding-bottom: 14px;
+ }
+ .advanced-toggle {
+ list-style: none;
+ cursor: pointer;
+ padding: 14px 0;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 12px;
+ color: var(--ink);
+ font-weight: 600;
+ }
+ .advanced-toggle::-webkit-details-marker { display: none; }
+ .advanced-toggle::after {
+ content: "展开";
+ font-size: 12px;
+ font-weight: 500;
+ color: var(--muted);
+ }
+ .advanced-box[open] .advanced-toggle::after {
+ content: "收起";
+ }
+ .token-summary {
+ font-size: 12px;
+ font-weight: 500;
+ color: var(--muted);
+ }
.row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.checks {
display: grid;
@@ -786,15 +826,27 @@ function renderPage() {
@@ -1001,6 +1053,9 @@ function renderPage() {
const storageKey = "storyforge-douyin-control-panel";
const sessionStorageKey = "storyforge-douyin-workbench-session";
const workbenchSessionEl = document.getElementById("workbench-session");
+ const tokenDetailsEl = document.getElementById("token-details");
+ const tokenInputEl = document.getElementById("token");
+ const tokenSummaryEl = document.getElementById("token-summary");
const accountsCountPillEl = document.getElementById("accounts-count-pill");
const accountsListEl = document.getElementById("accounts-list");
const accountsFilterEl = document.getElementById("accounts-filter");
@@ -1110,7 +1165,7 @@ function renderPage() {
const backendUrl = normalizeBackendUrl(document.getElementById("backend-url").value);
const username = document.getElementById("username").value.trim();
const password = document.getElementById("password").value;
- const token = document.getElementById("token").value.trim();
+ const token = tokenInputEl.value.trim();
return {
backendUrl,
username,
@@ -1119,6 +1174,14 @@ function renderPage() {
};
}
+ function updateTokenUi() {
+ const token = tokenInputEl.value.trim();
+ tokenSummaryEl.textContent = token ? "已填写 Token" : "未填写 Token";
+ if (!token && document.activeElement !== tokenInputEl) {
+ tokenDetailsEl.open = false;
+ }
+ }
+
function persistWorkbenchSession(session) {
workbenchState.session = session;
localStorage.setItem(sessionStorageKey, JSON.stringify(session));
@@ -1352,7 +1415,7 @@ function renderPage() {
'
当前账号' + escapeHtml(session.account?.display_name || session.account?.username || "未知账号") + '
',
'
角色' + escapeHtml(session.account?.role || "-") + '
',
'
后端地址' + escapeHtml(session.backendUrl) + '
',
- '
Token' + escapeHtml((session.token || "").slice(0, 12)) + "..." + '
'
+ '
认证状态Token 已缓存,可直接刷新工作台或复用到采集任务
'
].join("");
}
@@ -1747,7 +1810,7 @@ function renderPage() {
if (saved.profileUrl) document.getElementById("profile-url").value = saved.profileUrl;
if (saved.backendUrl) document.getElementById("backend-url").value = saved.backendUrl;
if (saved.username) document.getElementById("username").value = saved.username;
- if (saved.token) document.getElementById("token").value = saved.token;
+ if (saved.token) tokenInputEl.value = saved.token;
if (saved.note) document.getElementById("note").value = saved.note;
if (saved.maxVideos !== undefined) document.getElementById("max-videos").value = saved.maxVideos;
if (saved.syncEnabled !== undefined) document.getElementById("sync-enabled").checked = Boolean(saved.syncEnabled);
@@ -1755,6 +1818,7 @@ function renderPage() {
if (saved.skipCreatorCenter !== undefined) document.getElementById("skip-creator-center").checked = Boolean(saved.skipCreatorCenter);
if (saved.allowCreatorCenterFallback !== undefined) document.getElementById("allow-fallback").checked = Boolean(saved.allowCreatorCenterFallback);
} catch {}
+ updateTokenUi();
}
function saveValues(payload) {
@@ -1782,8 +1846,8 @@ function renderPage() {
password: document.getElementById("password").value,
storyforgeUsername: document.getElementById("username").value.trim(),
storyforgePassword: document.getElementById("password").value,
- token: document.getElementById("token").value.trim(),
- storyforgeToken: document.getElementById("token").value.trim(),
+ token: tokenInputEl.value.trim(),
+ storyforgeToken: tokenInputEl.value.trim(),
note: document.getElementById("note").value.trim(),
maxVideos: document.getElementById("max-videos").value,
syncEnabled: document.getElementById("sync-enabled").checked,
@@ -1813,6 +1877,18 @@ function renderPage() {
await refreshStatus();
});
+ tokenInputEl.addEventListener("focus", () => {
+ tokenDetailsEl.open = true;
+ });
+ tokenInputEl.addEventListener("input", updateTokenUi);
+ tokenDetailsEl.addEventListener("toggle", () => {
+ if (tokenDetailsEl.open) {
+ tokenSummaryEl.textContent = tokenInputEl.value.trim() ? "已填写 Token" : "填写后可跳过密码";
+ } else {
+ updateTokenUi();
+ }
+ });
+
workbenchLoginButton.addEventListener("click", loginWorkbench);
workbenchRefreshButton.addEventListener("click", async () => {