Bestellungen-Suche wieder auf Fragment laden
This commit is contained in:
@@ -588,7 +588,6 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $best
|
|||||||
echo " };";
|
echo " };";
|
||||||
echo " const buildUrl = (params) => {";
|
echo " const buildUrl = (params) => {";
|
||||||
echo " const url = new URL(window.location.href);";
|
echo " const url = new URL(window.location.href);";
|
||||||
echo " url.searchParams.delete('bestellungen_fragment');";
|
|
||||||
echo " url.hash = '';";
|
echo " url.hash = '';";
|
||||||
echo " Object.entries(params).forEach(([key, value]) => {";
|
echo " Object.entries(params).forEach(([key, value]) => {";
|
||||||
echo " if (value === null || value === undefined || value === '') {";
|
echo " if (value === null || value === undefined || value === '') {";
|
||||||
@@ -599,13 +598,68 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $best
|
|||||||
echo " });";
|
echo " });";
|
||||||
echo " return url;";
|
echo " return url;";
|
||||||
echo " };";
|
echo " };";
|
||||||
echo " const navigateTo = (params) => {";
|
echo " const buildFragmentUrl = (params) => {";
|
||||||
|
echo " const url = buildUrl(params);";
|
||||||
|
echo " url.searchParams.set('bestellungen_fragment', '1');";
|
||||||
|
echo " return url;";
|
||||||
|
echo " };";
|
||||||
|
echo " const replaceFragment = (html) => {";
|
||||||
|
echo " const doc = new DOMParser().parseFromString(html, 'text/html');";
|
||||||
|
echo " const fragment = doc.querySelector('[data-bestellungen-content]');";
|
||||||
|
echo " if (!fragment) {";
|
||||||
|
echo " return false;";
|
||||||
|
echo " }";
|
||||||
|
echo " contentRoot.innerHTML = fragment.innerHTML;";
|
||||||
|
echo " table = getTable();";
|
||||||
|
echo " return !!table;";
|
||||||
|
echo " };";
|
||||||
|
echo " const loadFragment = async (params) => {";
|
||||||
echo " if (searchTimer) { window.clearTimeout(searchTimer); searchTimer = null; }";
|
echo " if (searchTimer) { window.clearTimeout(searchTimer); searchTimer = null; }";
|
||||||
echo " window.location.assign(buildUrl(params).toString());";
|
echo " const url = buildFragmentUrl(params);";
|
||||||
|
echo " const response = await fetch(url.toString(), { credentials: 'same-origin', headers: { 'X-Requested-With': 'XMLHttpRequest' } });";
|
||||||
|
echo " const html = await response.text();";
|
||||||
|
echo " const replaced = replaceFragment(html);";
|
||||||
|
echo " if (replaced) {";
|
||||||
|
echo " const historyUrl = buildUrl(params);";
|
||||||
|
echo " window.history.replaceState({}, '', historyUrl);";
|
||||||
|
echo " bindTable();";
|
||||||
|
echo " }";
|
||||||
echo " };";
|
echo " };";
|
||||||
echo " const bindTable = () => {";
|
echo " const bindTable = () => {";
|
||||||
echo " table = getTable();";
|
echo " table = getTable();";
|
||||||
echo " if (!table) { return; }";
|
echo " if (!table) { return; }";
|
||||||
|
echo " const searchInput = getSearchInput();";
|
||||||
|
echo " const clearButton = table.querySelector('[data-bestellungen-search-clear]');";
|
||||||
|
echo " if (searchInput && searchInput.dataset.bestellungenBound !== 'true') {";
|
||||||
|
echo " searchInput.dataset.bestellungenBound = 'true';";
|
||||||
|
echo " searchInput.addEventListener('input', () => {";
|
||||||
|
echo " syncSearchState();";
|
||||||
|
echo " if (searchTimer) { window.clearTimeout(searchTimer); }";
|
||||||
|
echo " searchTimer = window.setTimeout(() => {";
|
||||||
|
echo " void loadFragment({";
|
||||||
|
echo " bestellungen_search: getSearchValue(),";
|
||||||
|
echo " bestellungen_sort: getSortColumn(),";
|
||||||
|
echo " bestellungen_dir: getSortDirection(),";
|
||||||
|
echo " bestellungen_limit: getPageSize(),";
|
||||||
|
echo " });";
|
||||||
|
echo " }, 250);";
|
||||||
|
echo " });";
|
||||||
|
echo " }";
|
||||||
|
echo " if (clearButton && clearButton.dataset.bestellungenBound !== 'true') {";
|
||||||
|
echo " clearButton.dataset.bestellungenBound = 'true';";
|
||||||
|
echo " clearButton.addEventListener('click', () => {";
|
||||||
|
echo " if (searchTimer) { window.clearTimeout(searchTimer); searchTimer = null; }";
|
||||||
|
echo " const input = getSearchInput();";
|
||||||
|
echo " if (input) { input.value = ''; }";
|
||||||
|
echo " syncSearchState();";
|
||||||
|
echo " void loadFragment({";
|
||||||
|
echo " bestellungen_search: '',";
|
||||||
|
echo " bestellungen_sort: getSortColumn(),";
|
||||||
|
echo " bestellungen_dir: getSortDirection(),";
|
||||||
|
echo " bestellungen_limit: getPageSize(),";
|
||||||
|
echo " });";
|
||||||
|
echo " });";
|
||||||
|
echo " }";
|
||||||
echo " syncSearchState();";
|
echo " syncSearchState();";
|
||||||
echo " };";
|
echo " };";
|
||||||
echo " if (!bestellungenTableHandlersInstalled) {";
|
echo " if (!bestellungenTableHandlersInstalled) {";
|
||||||
@@ -623,25 +677,10 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $best
|
|||||||
echo " closeDrawer();";
|
echo " closeDrawer();";
|
||||||
echo " return;";
|
echo " return;";
|
||||||
echo " }";
|
echo " }";
|
||||||
echo " const clearTrigger = event.target.closest('[data-bestellungen-search-clear]');";
|
|
||||||
echo " if (clearTrigger) {";
|
|
||||||
echo " event.preventDefault();";
|
|
||||||
echo " if (searchTimer) { window.clearTimeout(searchTimer); searchTimer = null; }";
|
|
||||||
echo " const input = getSearchInput();";
|
|
||||||
echo " if (input) { input.value = ''; }";
|
|
||||||
echo " syncSearchState();";
|
|
||||||
echo " navigateTo({";
|
|
||||||
echo " bestellungen_search: '',";
|
|
||||||
echo " bestellungen_sort: getSortColumn(),";
|
|
||||||
echo " bestellungen_dir: getSortDirection(),";
|
|
||||||
echo " bestellungen_limit: getPageSize(),";
|
|
||||||
echo " });";
|
|
||||||
echo " return;";
|
|
||||||
echo " }";
|
|
||||||
echo " const sortButton = event.target.closest('[data-bestellungen-sort-button]');";
|
echo " const sortButton = event.target.closest('[data-bestellungen-sort-button]');";
|
||||||
echo " if (sortButton) {";
|
echo " if (sortButton) {";
|
||||||
echo " event.preventDefault();";
|
echo " event.preventDefault();";
|
||||||
echo " navigateTo({";
|
echo " void loadFragment({";
|
||||||
echo " bestellungen_search: getSearchValue(),";
|
echo " bestellungen_search: getSearchValue(),";
|
||||||
echo " bestellungen_sort: sortButton.dataset.bestellungenSortColumn || getSortColumn(),";
|
echo " bestellungen_sort: sortButton.dataset.bestellungenSortColumn || getSortColumn(),";
|
||||||
echo " bestellungen_dir: sortButton.dataset.bestellungenSortDirection || getSortDirection(),";
|
echo " bestellungen_dir: sortButton.dataset.bestellungenSortDirection || getSortDirection(),";
|
||||||
@@ -652,7 +691,7 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $best
|
|||||||
echo " const loadMoreTrigger = event.target.closest('[data-large-table-load-more-trigger]');";
|
echo " const loadMoreTrigger = event.target.closest('[data-large-table-load-more-trigger]');";
|
||||||
echo " if (loadMoreTrigger) {";
|
echo " if (loadMoreTrigger) {";
|
||||||
echo " event.preventDefault();";
|
echo " event.preventDefault();";
|
||||||
echo " navigateTo({";
|
echo " void loadFragment({";
|
||||||
echo " bestellungen_search: getSearchValue(),";
|
echo " bestellungen_search: getSearchValue(),";
|
||||||
echo " bestellungen_sort: getSortColumn(),";
|
echo " bestellungen_sort: getSortColumn(),";
|
||||||
echo " bestellungen_dir: getSortDirection(),";
|
echo " bestellungen_dir: getSortDirection(),";
|
||||||
@@ -660,22 +699,6 @@ function render_auth_home_page(array $user, array $otcProducts = [], array $best
|
|||||||
echo " });";
|
echo " });";
|
||||||
echo " }";
|
echo " }";
|
||||||
echo " });";
|
echo " });";
|
||||||
echo " contentRoot.addEventListener('input', (event) => {";
|
|
||||||
echo " const searchInput = event.target.closest('[data-large-table-search]');";
|
|
||||||
echo " if (!searchInput) {";
|
|
||||||
echo " return;";
|
|
||||||
echo " }";
|
|
||||||
echo " syncSearchState();";
|
|
||||||
echo " if (searchTimer) { window.clearTimeout(searchTimer); }";
|
|
||||||
echo " searchTimer = window.setTimeout(() => {";
|
|
||||||
echo " navigateTo({";
|
|
||||||
echo " bestellungen_search: getSearchValue(),";
|
|
||||||
echo " bestellungen_sort: getSortColumn(),";
|
|
||||||
echo " bestellungen_dir: getSortDirection(),";
|
|
||||||
echo " bestellungen_limit: getPageSize(),";
|
|
||||||
echo " });";
|
|
||||||
echo " }, 250);";
|
|
||||||
echo " });";
|
|
||||||
echo " document.addEventListener('keydown', (event) => {";
|
echo " document.addEventListener('keydown', (event) => {";
|
||||||
echo " if (event.key === 'Escape') {";
|
echo " if (event.key === 'Escape') {";
|
||||||
echo " closeDrawer();";
|
echo " closeDrawer();";
|
||||||
|
|||||||
Reference in New Issue
Block a user