// 可折叠Notebook功能 console.log('Collapsible Notebook JS loaded'); /** * 页面加载完成后自动初始化所有可折叠notebook */ function initCollapsibleNotebooks() { console.log('Initializing collapsible notebooks...'); // 初始化现有的notebook const existingNotebooks = document.querySelectorAll('.o_collapsible_notebook'); console.log('Found notebooks:', existingNotebooks.length); if (existingNotebooks.length === 0) { console.log('No notebooks found, retrying in 500ms...'); setTimeout(initCollapsibleNotebooks, 500); return; } existingNotebooks.forEach((notebook, index) => { console.log(`Processing notebook ${index}:`, notebook); if (!notebook.hasAttribute('data-collapsible-initialized')) { initializeNotebook(notebook); notebook.setAttribute('data-collapsible-initialized', 'true'); } }); } // 页面加载完成后初始化 document.addEventListener('DOMContentLoaded', function() { console.log('DOM Content Loaded'); initCollapsibleNotebooks(); }); // 如果DOM已经加载完成,立即初始化 if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', initCollapsibleNotebooks); } else { initCollapsibleNotebooks(); } // 使用MutationObserver来监听DOM变化,确保在动态加载的内容中也能工作 function setupMutationObserver() { if (!document.body) { console.log('Document body not ready, retrying...'); setTimeout(setupMutationObserver, 100); return; } const observer = new MutationObserver(function(mutations) { mutations.forEach(function(mutation) { if (mutation.type === 'childList') { mutation.addedNodes.forEach(function(node) { if (node.nodeType === Node.ELEMENT_NODE) { const notebooks = node.querySelectorAll ? node.querySelectorAll('.o_collapsible_notebook') : (node.classList && node.classList.contains('o_collapsible_notebook') ? [node] : []); notebooks.forEach(notebook => { if (!notebook.hasAttribute('data-collapsible-initialized')) { console.log('New notebook detected:', notebook); initializeNotebook(notebook); notebook.setAttribute('data-collapsible-initialized', 'true'); } }); } }); } }); }); // 开始观察 observer.observe(document.body, { childList: true, subtree: true }); console.log('MutationObserver setup complete'); } // 设置MutationObserver setupMutationObserver(); /** * 初始化单个notebook */ function initializeNotebook(notebook) { console.log('Initializing notebook:', notebook); // 为整个notebook添加折叠/展开按钮 addNotebookCollapseButton(notebook); } /** * 为整个notebook添加折叠/展开按钮 */ function addNotebookCollapseButton(notebook) { console.log('Adding collapse button to notebook:', notebook); console.log('Notebook HTML structure:', notebook.outerHTML); // 检查是否已经添加了按钮 if (notebook.querySelector('.o_notebook_collapse_btn')) { console.log('Collapse button already exists'); return; } // 创建notebook折叠按钮 const notebookCollapseBtn = document.createElement('div'); notebookCollapseBtn.className = 'o_notebook_collapse_btn'; notebookCollapseBtn.innerHTML = ''; notebookCollapseBtn.title = '点击折叠/展开整个Notebook'; console.log('Created collapse button:', notebookCollapseBtn); // 添加点击事件 notebookCollapseBtn.addEventListener('click', (e) => { console.log('Collapse button clicked'); e.preventDefault(); e.stopPropagation(); toggleNotebook(notebook, notebookCollapseBtn); }); // 将按钮添加到notebook的nav-tabs前面(与页面标签并排) try { const navTabs = notebook.querySelector('.nav-tabs'); if (navTabs && navTabs.parentNode) { navTabs.parentNode.insertBefore(notebookCollapseBtn, navTabs); console.log('Button inserted successfully before nav-tabs'); } else if (notebook.parentNode) { notebook.parentNode.insertBefore(notebookCollapseBtn, notebook); console.log('Button inserted successfully before notebook (fallback)'); } else { notebook.insertBefore(notebookCollapseBtn, notebook.firstChild); console.log('Button inserted successfully inside notebook (fallback)'); } } catch (error) { console.error('Error inserting button:', error); } // 恢复折叠状态 restoreNotebookState(notebook, notebookCollapseBtn); } /** * 从localStorage恢复notebook折叠状态 */ function restoreNotebookState(notebook, button) { try { const notebookId = notebook.getAttribute('id') || 'default_notebook'; const savedState = localStorage.getItem(`odoo_notebook_collapsed_${notebookId}`); if (savedState === 'true') { console.log('Restoring collapsed state for notebook:', notebookId); notebook.classList.add('o_notebook_collapsed'); button.innerHTML = ''; button.classList.add('o_collapsed'); // 直接设置内容隐藏 const tabContent = notebook.querySelector('.tab-content'); if (tabContent) { tabContent.style.display = 'none'; } } else { console.log('Notebook starts in expanded state:', notebookId); } } catch (error) { console.error('Error restoring notebook state:', error); } } /** * 切换整个notebook的折叠/展开状态 */ function toggleNotebook(notebook, button) { console.log('Toggling notebook:', notebook); console.log('Notebook classes before:', notebook.className); const isCollapsed = notebook.classList.contains('o_notebook_collapsed'); console.log('Current state - isCollapsed:', isCollapsed); // 查找tab-content元素 const tabContent = notebook.querySelector('.tab-content'); console.log('Found tab-content:', tabContent); if (isCollapsed) { // 展开notebook console.log('Expanding notebook'); notebook.classList.remove('o_notebook_collapsed'); button.innerHTML = ''; button.classList.remove('o_collapsed'); if (tabContent) { tabContent.style.display = 'block'; console.log('Set tab-content display to block'); } } else { // 折叠notebook console.log('Collapsing notebook'); notebook.classList.add('o_notebook_collapsed'); button.innerHTML = ''; button.classList.add('o_collapsed'); if (tabContent) { tabContent.style.display = 'none'; console.log('Set tab-content display to none'); } } console.log('Notebook classes after:', notebook.className); // 保存状态 const notebookId = notebook.getAttribute('id') || 'default_notebook'; localStorage.setItem(`odoo_notebook_collapsed_${notebookId}`, isCollapsed ? 'false' : 'true'); console.log('State saved to localStorage'); }