diff --git a/popup.css b/popup.css index 43f3ddb..12da906 100644 --- a/popup.css +++ b/popup.css @@ -294,7 +294,6 @@ h2 { .lock-screen { position: fixed; inset: 0; - background: #0f0f1e; display: flex; align-items: center; justify-content: center; @@ -306,7 +305,6 @@ h2 { max-width: 320px; padding: 28px 24px; text-align: center; - box-shadow: 0 8px 32px rgba(233, 69, 96, 0.15); } .lock-logo { @@ -893,6 +891,21 @@ h2 { flex: 1; } +/* 编辑域名配置对话框：字段较多，允许滚动并加宽 */ +.edit-config-content { + max-width: 380px; + max-height: 90vh; + overflow-y: auto; +} + +.edit-config-content .modal-actions { + position: sticky; + bottom: 0; + background: #16213e; + padding-top: 10px; + margin-top: 12px; +} + /* 环境管理对话框列表 */ .env-manage-list { display: flex; diff --git a/popup.html b/popup.html index 3d47752..7aa83c0 100644 --- a/popup.html +++ b/popup.html @@ -223,6 +223,75 @@ + + + diff --git a/popup.js b/popup.js index 053051f..d61eaff 100644 --- a/popup.js +++ b/popup.js @@ -66,6 +66,22 @@ document.addEventListener("DOMContentLoaded", () => { const importFile = $("importFile"); const toast = $("toast"); + // 编辑配置弹窗 + const editConfigModal = $("editConfigModal"); + const editDomainInput = $("editDomain"); + const editUsernameInput = $("editUsername"); + const editPasswordInput = $("editPassword"); + const editAliasInput = $("editAlias"); + const editAutoSubmitSelect = $("editAutoSubmit"); + const editEnabledCheckbox = $("editEnabled"); + const editDelayMsInput = $("editDelayMs"); + const editUsernameSelectorInput = $("editUsernameSelector"); + const editPasswordSelectorInput = $("editPasswordSelector"); + const editSubmitSelectorInput = $("editSubmitSelector"); + const editConfigCancel = $("editConfigCancel"); + const editConfigSave = $("editConfigSave"); + let editModalEditingId = null; + // 锁定界面 const lockScreen = $("lockScreen"); const mainContainer = $("mainContainer"); @@ -429,10 +445,11 @@ document.addEventListener("DOMContentLoaded", () => { submitSelectorInput.value = draft.submitSelector || ""; enabledCheckbox.checked = draft.enabled !== false; delayMsInput.value = draft.delayMs || ""; - editingId = draft.editingId || null; - addBtn.textContent = editingId ? t("updateConfigBtn") : t("addConfigBtn"); - addConfigTitleEl.textContent = editingId ? t("editConfigTitle") : t("addConfigTitle"); - cancelEditBtn.hidden = !editingId; + editingId = null; + // 编辑已改为弹窗，顶部表单仅用于新增；忽略历史 draft 中的 editingId + addBtn.textContent = t("addConfigBtn"); + addConfigTitleEl.textContent = t("addConfigTitle"); + cancelEditBtn.hidden = true; } function clearDraft() { @@ -706,22 +723,19 @@ document.addEventListener("DOMContentLoaded", () => { editBtn.className = "btn-edit"; editBtn.textContent = t("editBtn"); editBtn.addEventListener("click", () => { - editingId = cfg.id; - domainInput.value = cfg.domain; - aliasInput.value = cfg.alias || ""; - usernameInput.value = cfg.username; - passwordInput.value = cfg.password; - autoSubmitSelect.value = String(cfg.autoSubmit); - usernameSelectorInput.value = cfg.usernameSelector || ""; - passwordSelectorInput.value = cfg.passwordSelector || ""; - submitSelectorInput.value = cfg.submitSelector || ""; - enabledCheckbox.checked = cfg.enabled !== false; - delayMsInput.value = cfg.delayMs || ""; - addBtn.textContent = t("updateConfigBtn"); - addConfigTitleEl.textContent = t("editConfigTitle"); - cancelEditBtn.hidden = false; - saveDraft(); - domainInput.focus(); + editModalEditingId = cfg.id; + editDomainInput.value = cfg.domain; + editAliasInput.value = cfg.alias || ""; + editUsernameInput.value = cfg.username; + editPasswordInput.value = cfg.password; + editAutoSubmitSelect.value = String(cfg.autoSubmit); + editUsernameSelectorInput.value = cfg.usernameSelector || ""; + editPasswordSelectorInput.value = cfg.passwordSelector || ""; + editSubmitSelectorInput.value = cfg.submitSelector || ""; + editEnabledCheckbox.checked = cfg.enabled !== false; + editDelayMsInput.value = cfg.delayMs || ""; + editConfigModal.classList.add("show"); + editDomainInput.focus(); }); const delBtn = document.createElement("button"); @@ -816,6 +830,59 @@ document.addEventListener("DOMContentLoaded", () => { if (envManageModal.classList.contains("show")) renderEnvManageList(); }); + // 编辑配置弹窗：保存 + editConfigSave.addEventListener("click", async () => { + const domain = editDomainInput.value.trim(); + const username = editUsernameInput.value.trim(); + const password = editPasswordInput.value; + + if (!domain || !username || !password) { + showToast(t("toastRequired")); + return; + } + + const config = { + id: editModalEditingId, + domain, + alias: editAliasInput.value.trim() || null, + username, + password, + autoSubmit: editAutoSubmitSelect.value === "true", + usernameSelector: editUsernameSelectorInput.value.trim() || null, + passwordSelector: editPasswordSelectorInput.value.trim() || null, + submitSelector: editSubmitSelectorInput.value.trim() || null, + enabled: editEnabledCheckbox.checked, + delayMs: editDelayMsInput.value ? Number(editDelayMsInput.value) : null, + }; + + const configs = await loadConfigs(); + const idx = configs.findIndex((c) => c.id === editModalEditingId); + if (idx !== -1) { + configs[idx] = config; + } + await saveConfigs(configs); + editConfigModal.classList.remove("show"); + editModalEditingId = null; + renderConfigList(); + renderEnvSelect(); + if (envManageModal.classList.contains("show")) renderEnvManageList(); + showToast(t("toastUpdated")); + }); + + // 编辑配置弹窗：取消 + editConfigCancel.addEventListener("click", () => { + editConfigModal.classList.remove("show"); + editModalEditingId = null; + }); + + // 点击遮罩关闭编辑弹窗 + editConfigModal.addEventListener("click", (e) => { + if (e.target === editConfigModal) { + editConfigModal.classList.remove("show"); + editModalEditingId = null; + } + }); + fillCurrentBtn.addEventListener("click", async () => { const [tab] = await chrome.tabs.query({ active: true, currentWindow: true }); if (!tab) {