From 8d8e13dd12b6d0ef0b190630a8b2d3acb1f1360c Mon Sep 17 00:00:00 2001 From: Marcel Werk Date: Sat, 7 May 2022 19:09:50 +0200 Subject: [PATCH] Tracked the result page number in the url --- ts/WoltLabSuite/Core/Ui/Search/Extended.ts | 23 ++++++++++++++----- .../WoltLabSuite/Core/Ui/Search/Extended.js | 22 +++++++++++------- 2 files changed, 31 insertions(+), 14 deletions(-) diff --git a/ts/WoltLabSuite/Core/Ui/Search/Extended.ts b/ts/WoltLabSuite/Core/Ui/Search/Extended.ts index 655d787486..1494a01a88 100644 --- a/ts/WoltLabSuite/Core/Ui/Search/Extended.ts +++ b/ts/WoltLabSuite/Core/Ui/Search/Extended.ts @@ -29,8 +29,11 @@ type ResponseSearchResults = { template: string; }; +type SearchParameters = string[][]; + const enum SearchAction { Modify, + Navigation, Init, } @@ -45,6 +48,7 @@ export class UiSearchExtended { private lastSearchRequest: AbortController | undefined = undefined; private lastSearchResultRequest: AbortController | undefined = undefined; private delimiter: HTMLDivElement; + private searchParameters: SearchParameters = []; constructor() { this.form = document.getElementById("extendedSearchForm") as HTMLFormElement; @@ -120,12 +124,16 @@ export class UiSearchExtended { const url = new URL(this.form.action); url.search += url.search !== "" ? "&" : "?"; - const parameters: string[][] = []; - new FormData(this.form).forEach((value, key) => { - if (value.toString().trim()) { - parameters.push([key, value.toString().trim()]); - } - }); + if (searchAction !== SearchAction.Navigation) { + this.searchParameters = []; + new FormData(this.form).forEach((value, key) => { + if (value.toString().trim()) { + this.searchParameters.push([key, value.toString().trim()]); + } + }); + } + const parameters = this.searchParameters.slice(); + if (this.activePage > 1) { parameters.push(["pageNo", this.activePage.toString()]); } @@ -153,6 +161,8 @@ export class UiSearchExtended { } private initQueryString(): void { + this.activePage = 1; + const url = new URL(window.location.href); url.searchParams.forEach((value, key) => { if (key === "pageNo") { @@ -222,6 +232,7 @@ export class UiSearchExtended { this.activePage = pageNo; this.removeSearchResults(); this.showSearchResults(template); + this.updateQueryString(SearchAction.Navigation); } private removeSearchResults(): void { diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Search/Extended.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Search/Extended.js index 4beb670ba3..03528c0891 100644 --- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Search/Extended.js +++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Search/Extended.js @@ -22,6 +22,7 @@ define(["require", "exports", "tslib", "../../Ajax", "../../Date/Picker", "../.. this.activePage = 1; this.lastSearchRequest = undefined; this.lastSearchResultRequest = undefined; + this.searchParameters = []; this.form = document.getElementById("extendedSearchForm"); this.queryInput = document.getElementById("searchQuery"); this.typeInput = document.getElementById("searchType"); @@ -81,17 +82,20 @@ define(["require", "exports", "tslib", "../../Ajax", "../../Date/Picker", "../.. updateQueryString(searchAction) { const url = new URL(this.form.action); url.search += url.search !== "" ? "&" : "?"; - const parameters = []; - new FormData(this.form).forEach((value, key) => { - if (value.toString().trim()) { - parameters.push([key, value.toString().trim()]); - } - }); + if (searchAction !== 1 /* Navigation */) { + this.searchParameters = []; + new FormData(this.form).forEach((value, key) => { + if (value.toString().trim()) { + this.searchParameters.push([key, value.toString().trim()]); + } + }); + } + const parameters = this.searchParameters.slice(); if (this.activePage > 1) { parameters.push(["pageNo", this.activePage.toString()]); } url.search += new URLSearchParams(parameters); - if (searchAction === 1 /* Init */) { + if (searchAction === 2 /* Init */) { window.history.replaceState({}, document.title, url.toString()); } else { @@ -111,6 +115,7 @@ define(["require", "exports", "tslib", "../../Ajax", "../../Date/Picker", "../.. return data; } initQueryString() { + this.activePage = 1; const url = new URL(window.location.href); url.searchParams.forEach((value, key) => { if (key === "pageNo") { @@ -146,7 +151,7 @@ define(["require", "exports", "tslib", "../../Ajax", "../../Date/Picker", "../.. } }); this.typeInput.dispatchEvent(new Event("change")); - void this.search(1 /* Init */); + void this.search(2 /* Init */); } initPagination(position) { const wrapperDiv = document.createElement("div"); @@ -178,6 +183,7 @@ define(["require", "exports", "tslib", "../../Ajax", "../../Date/Picker", "../.. this.activePage = pageNo; this.removeSearchResults(); this.showSearchResults(template); + this.updateQueryString(1 /* Navigation */); } removeSearchResults() { while (this.form.nextSibling !== null && this.form.nextSibling !== this.delimiter) { -- 2.20.1