diff --git a/css/styles.css b/css/styles.css index fd5134f..c91f160 100644 --- a/css/styles.css +++ b/css/styles.css @@ -80,6 +80,15 @@ a:hover { text-decoration: underline; } .user-company, .user-email { font-size: .9rem; color: #6b7280; margin: 0; } .user-location { font-size: .85rem; color: #6b7280; margin: 4px 0 0 0; } .user-description { font-size: .85rem; color: #4b5563; margin: 8px 0 0 0; max-height: 40px; overflow: hidden; text-overflow: ellipsis; } +.wiki-accordion { margin: 24px 0; } +.wiki-topic { margin-bottom: 16px; } +.wiki-topic h4 { font-size: 1.1rem; font-weight: 600; padding: 12px 16px; background: var(--gray1); border-radius: 8px; cursor: pointer; transition: background .2s; } +.wiki-topic h4:hover { background: var(--gray2); } +.wiki-subtopic { margin-left: 24px; border-left: 2px solid var(--gray2); padding-left: 16px; } +.wiki-subtopic.hidden { display: none; } +.wiki-subtopic-title { font-weight: 600; padding: 8px 0; cursor: pointer; } +.wiki-subtopic-title:hover { color: var(--blue); } +.wiki-subtopic-content { padding: 12px 16px; background: var(--gray1); border-radius: 8px; margin-top: 8px; } .user-actions { display: flex; gap: 12px; align-items: center; } .user-btn { padding: 8px 16px; font-size: .85rem; } .modal { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.5); z-index: 999; display: flex; align-items: center; justify-content: center; } diff --git a/index.html b/index.html index b265109..57f47e2 100644 --- a/index.html +++ b/index.html @@ -161,8 +161,10 @@ diff --git a/js/main.js b/js/main.js index b2a8b56..a43e3d9 100644 --- a/js/main.js +++ b/js/main.js @@ -2,6 +2,7 @@ document.addEventListener('DOMContentLoaded', () => { checkSession(); if (getCookie('sessionid')) { loadUsers(); + loadWiki(); } }); @@ -22,6 +23,7 @@ const API_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/login'; const NEWSLETTER_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/newsletter'; const USER_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/user'; const PROFILE_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/profile'; +const WIKI_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/wiki'; function checkSession() { const sessionid = getCookie('sessionid'); @@ -63,6 +65,7 @@ document.querySelectorAll('.notebook .tab').forEach(tab => { document.querySelectorAll('.notebook .tab-content').forEach(c => c.classList.add('hidden')); document.getElementById('tab-' + tabName).classList.remove('hidden'); if (tabName === 'users') loadUsers(); + if (tabName === 'wiki') loadWiki(); }); }); @@ -304,6 +307,73 @@ function closeProfileModal() { document.getElementById('profile-modal').classList.add('hidden'); } +async function loadWiki() { + const wikiContainer = document.getElementById('wiki-content'); + if (!wikiContainer) return; + console.log('loadWiki: starting fetch from', WIKI_URL); + try { + const response = await fetch(WIKI_URL); + console.log('loadWiki: response status =', response.status); + if (!response.ok) throw new Error('Failed to fetch wiki'); + const result = await response.json(); + console.log('loadWiki: response data =', result); + + if (result.data && Array.isArray(result.data)) { + wikiContainer.innerHTML = ''; + const topics = {}; + + result.data.forEach(item => { + const topic = item.topic || 'Unknown'; + if (!topics[topic]) topics[topic] = []; + topics[topic].push(item); + }); + + for (const [topicName, subtopics] of Object.entries(topics)) { + const topicDiv = document.createElement('div'); + topicDiv.className = 'wiki-topic'; + topicDiv.innerHTML = ` +

${topicName}

+

${topicName}

+
+ `; + wikiContainer.appendChild(topicDiv); + + const subtopicsDiv = topicDiv.querySelector('.wiki-subtopics'); + subtopics.forEach(sub => { + const subtopicDiv = document.createElement('div'); + subtopicDiv.className = 'wiki-subtopic hidden'; + subtopicDiv.innerHTML = ` +
${sub.subtopic}
+
${sub.subtopic}
+
+

${sub.wiki || 'Keine Informationen verfügbar.'}

+

${sub.wiki || 'No information available.'}

+
+ `; + subtopicsDiv.appendChild(subtopicDiv); + + const title = subtopicDiv.querySelector('.wiki-subtopic-title'); + title.onclick = () => { + subtopicDiv.classList.toggle('hidden'); + }; + }); + + // Auto-expand first subtopic + if (subtopics.length > 0) { + setTimeout(() => { + subtopicsDiv.lastElementChild.classList.remove('hidden'); + }, 100); + } + } + } else { + wikiContainer.innerHTML = '

No wiki data found.

'; + } + } catch (error) { + console.error('loadWiki error:', error); + wikiContainer.innerHTML = '

Error loading wiki: ' + error.message + '

'; + } +} + function logout() { setCookie('sessionid', '', -1); checkSession();