wangshuxun/zotero-kb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: add minimal zotero modal lifecycle

Browse Source
This commit is contained in:
Saberlve 2026-04-15 12:22:49 +08:00
parent 0e62d0fc4e
commit d52a52b574
1 changed files with 33 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
src/zotero_kb/templates/index.html
View File

@ -28,6 +28,9 @@
linear-gradient(180deg, #f7f2e8, var(--bg)); linear-gradient(180deg, #f7f2e8, var(--bg));
color: var(--ink); color: var(--ink);
} }
body.modal-open {
overflow: hidden;
}
.layout { .layout {
display: grid; display: grid;
grid-template-columns: 20rem 1fr 26rem; grid-template-columns: 20rem 1fr 26rem;
@ -389,6 +392,10 @@
projectForm: document.getElementById("create-project-form"), projectForm: document.getElementById("create-project-form"),
projectStatus: document.getElementById("project-status"), projectStatus: document.getElementById("project-status"),
projectList: document.getElementById("project-list"), projectList: document.getElementById("project-list"),
importModal: document.getElementById("import-modal"),
importModalOverlay: document.getElementById("import-modal-overlay"),
openImportModalButton: document.getElementById("open-import-modal-button"),
closeImportModalButton: document.getElementById("close-import-modal-button"),
currentProjectLabel: document.getElementById("current-project-label"), currentProjectLabel: document.getElementById("current-project-label"),
cardList: document.getElementById("card-list"), cardList: document.getElementById("card-list"),
cardDetail: document.getElementById("card-detail"), cardDetail: document.getElementById("card-detail"),
@ -520,6 +527,22 @@
`).join(""); `).join("");
} }
function syncImportModalVisibility() {
elements.importModal.hidden = !state.isImportModalOpen;
elements.importModal.setAttribute("aria-hidden", state.isImportModalOpen ? "false" : "true");
document.body.classList.toggle("modal-open", state.isImportModalOpen);
}
function openImportModal() {
state.isImportModalOpen = true;
syncImportModalVisibility();
}
function closeImportModal() {
state.isImportModalOpen = false;
syncImportModalVisibility();
}
async function loadProjects() { async function loadProjects() {
const projects = await api("/api/projects"); const projects = await api("/api/projects");
state.projects = projects; state.projects = projects;
@ -577,6 +600,15 @@
elements.refreshProjectsButton.addEventListener("click", loadProjects); elements.refreshProjectsButton.addEventListener("click", loadProjects);
elements.openImportModalButton.addEventListener("click", openImportModal);
elements.closeImportModalButton.addEventListener("click", closeImportModal);
elements.importModalOverlay.addEventListener("click", closeImportModal);
document.addEventListener("keydown", (event) => {
if (event.key === "Escape" && state.isImportModalOpen) {
closeImportModal();
}
});
elements.recommendForm.addEventListener("submit", async (event) => { elements.recommendForm.addEventListener("submit", async (event) => {
event.preventDefault(); event.preventDefault();
if (!state.currentProjectId) { if (!state.currentProjectId) {
@ -628,6 +660,7 @@
elements.recommendTab.addEventListener("click", () => activateTab("recommend")); elements.recommendTab.addEventListener("click", () => activateTab("recommend"));
elements.planTab.addEventListener("click", () => activateTab("plan")); elements.planTab.addEventListener("click", () => activateTab("plan"));
syncImportModalVisibility();
loadProjects().catch((error) => { loadProjects().catch((error) => {
setStatus(elements.projectStatus, error.message, true); setStatus(elements.projectStatus, error.message, true);
}); });