From 2ee52b367290e06de1569affa6af5d8e8ccf19b4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mathias=20Gla=CC=88ser?= Date: Sun, 6 Sep 2026 17:41:14 +0200 Subject: [PATCH] =?UTF-8?q?Mobile=20Produktdetail=20per=20DOM-Klon=20bef?= =?UTF-8?q?=C3=BCllen?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- modules/shared/auth/ui/home.php | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/modules/shared/auth/ui/home.php b/modules/shared/auth/ui/home.php index f4ba6d7..8f47bd4 100644 --- a/modules/shared/auth/ui/home.php +++ b/modules/shared/auth/ui/home.php @@ -785,7 +785,7 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $best echo " let lagerMobileDetailHost = null;"; echo " let lagerMobileDetailOpen = false;"; echo <<<'JS' - const renderLagerMobileDetail = () => { const sourceDrawer = contentRoot.querySelector('[data-lager-drawer]'); if (!sourceDrawer) { return ''; } return `
${sourceDrawer.outerHTML.replace('data-lager-drawer="true"', 'data-lager-drawer="true" data-lager-mobile-drawer="true"')}
`; }; + const renderLagerMobileDetail = () => '
'; JS; echo " const restoreLagerMobileDetail = () => {"; echo " if (lagerMobileDetailHost && lagerMobileDetailHost.parentNode) { lagerMobileDetailHost.parentNode.removeChild(lagerMobileDetailHost); }"; @@ -812,7 +812,7 @@ JS; echo " });"; echo " contentRoot.addEventListener('click', (event) => { const trigger = event.target.closest('[data-lager-drawer-open]'); if (!trigger || trigger.dataset.lagerDrawerType !== 'Produkt') { return; } const header = getDrawer()?.querySelector('[data-lager-drawer-warning-header]'); const title = getDrawer()?.querySelector('[data-lager-drawer-warning-title]'); if (!header || !title) { return; } const forecastWarning = trigger.dataset.lagerDrawerForecastWarning === 'true'; const mhdWarning = trigger.dataset.lagerDrawerForecastMhdWarning === 'true'; title.textContent = getLagerWarningTitle(trigger); header.classList.toggle('sg-card-segment--darkgreen', !forecastWarning && !mhdWarning); header.classList.toggle('sg-card-segment--signal-red', forecastWarning); header.classList.toggle('sg-card-segment--signal-yellow', mhdWarning); });"; echo " contentRoot.addEventListener('click', (event) => { const trigger = event.target.closest('[data-lager-drawer-open]'); if (!trigger || trigger.dataset.lagerDrawerType !== 'Produkt') { return; } setLagerEditMode(false); const drawer = getDrawer(); const currentQty = drawer?.querySelector('[data-lager-drawer-current-qty]'); const qtyIn = drawer?.querySelector('[data-lager-drawer-qty-in]'); const lotNumber = drawer?.querySelector('[data-lager-lot-number]'); if (currentQty) { currentQty.textContent = trigger.dataset.lagerDrawerCurrentQty || '0'; } if (qtyIn) { qtyIn.textContent = trigger.dataset.lagerDrawerQtyIn || '0'; } if (lotNumber) { lotNumber.value = trigger.dataset.lagerDrawerLotNumber || ''; } const productId = trigger.closest('[data-lager-row]')?.dataset.lagerId || ''; drawer?.querySelectorAll('[data-lager-historical-product]').forEach((product) => { product.hidden = product.dataset.lagerHistoricalProduct !== productId; }); });"; - echo " contentRoot.addEventListener('click', (event) => { const trigger = event.target.closest('[data-lager-drawer-open]'); if (trigger && window.matchMedia('(max-width: 767px)').matches) { const host = document.createElement('div'); host.innerHTML = renderLagerMobileDetail(); lagerMobileDetailHost = host.firstElementChild; const mobileDrawer = lagerMobileDetailHost?.querySelector('[data-lager-mobile-drawer]'); if (lagerMobileDetailHost && mobileDrawer) { contentRoot.appendChild(lagerMobileDetailHost); mobileDrawer.dataset.open = 'true'; mobileDrawer.setAttribute('aria-hidden', 'false'); lagerMobileDetailOpen = true; document.body.classList.add('sg-lager-mobile-detail-open'); } return; } if (event.target.closest('[data-lager-detail-back]') || (event.target.closest('[data-lager-drawer-close]') && lagerMobileDetailOpen)) { restoreLagerMobileDetail(); } });"; + echo " contentRoot.addEventListener('click', (event) => { const trigger = event.target.closest('[data-lager-drawer-open]'); if (trigger && window.matchMedia('(max-width: 767px)').matches) { const sourceDrawer = contentRoot.querySelector('[data-lager-drawer]:not([data-lager-mobile-drawer])'); const host = document.createElement('div'); host.innerHTML = renderLagerMobileDetail(); lagerMobileDetailHost = host.firstElementChild; const mobileDrawer = sourceDrawer?.cloneNode(true); if (lagerMobileDetailHost && mobileDrawer) { mobileDrawer.dataset.lagerMobileDrawer = 'true'; mobileDrawer.dataset.open = 'true'; mobileDrawer.setAttribute('aria-hidden', 'false'); lagerMobileDetailHost.appendChild(mobileDrawer); contentRoot.appendChild(lagerMobileDetailHost); lagerMobileDetailOpen = true; document.body.classList.add('sg-lager-mobile-detail-open'); } return; } if (event.target.closest('[data-lager-detail-back]') || (event.target.closest('[data-lager-drawer-close]') && lagerMobileDetailOpen)) { restoreLagerMobileDetail(); } });"; echo " const postLagerChange = async (payload) => { const response = await fetch('/api/lager-charge.php', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ ...payload, csrfToken: contentRoot.querySelector('[data-lager-csrf-token]')?.dataset.lagerCsrfToken || '' }) }); const result = await response.json(); if (!response.ok || result.ok !== true) { throw new Error(result.error || 'Speichern fehlgeschlagen'); } return result; };"; echo " contentRoot.addEventListener('click', (event) => { const editButton = event.target.closest('[data-lager-edit-open]'); if (editButton) { const drawer = getDrawer(); const editForm = drawer?.querySelector('[data-lager-edit-form]'); if (editForm) { editForm.hidden = false; } return; } const closeButton = event.target.closest('[data-lager-edit-close]'); if (closeButton) { const drawer = getDrawer(); const editForm = drawer?.querySelector('[data-lager-edit-form]'); if (editForm) { editForm.hidden = true; } } });"; echo " const setLagerEditMode = (editing) => { const drawer = getDrawer(); const readView = drawer?.querySelector('[data-lager-read-view]'); const editForm = drawer?.querySelector('[data-lager-edit-form]'); if (readView) { readView.hidden = editing; } if (editForm) { editForm.hidden = !editing; } };";