robbond/pedwfrontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

pagination on dns results fix

Browse Source
This commit is contained in:
robbond
2022-02-09 13:49:56 +00:00
parent d1d86742ef
commit 42c0934c2c
5 changed files with 55 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/search/dnssearchresults.js
+33 -26
View File
@@ -38,6 +38,7 @@ const DNSSearchResults = (props) => {
var resultsArr = searchResultsObj.value || [];
const [searchLoaded, setSearchLoaded] = useState(false);
const [showSpinnerState, setShowSpinnerState] = useState(false);
let spinnerState = () => {
@@ -311,7 +312,7 @@ const DNSSearchResults = (props) => {
const getSearchPageResults = (pageNumber, orderBy, fieldSort) => {
//console.log(advancedSearch, searchString, pageNumber);
getBasicDNSSearchPaged(pageNumber, orderBy, fieldSort)
getBasicDNSSearchPaged(pageNumber, orderBy, fieldSort, selectedOption)
.then((data) => {
return data;
})
@@ -338,9 +339,13 @@ const DNSSearchResults = (props) => {
};
useEffect(() => {
if (selectedOption) {
setShowSpinnerState(true);
getSearchPageResults(1, orderByState, fieldSortState);
if (searchLoaded) {
if (selectedOption) {
setShowSpinnerState(true);
getSearchPageResults(1, orderByState, fieldSortState);
}
} else {
setSearchLoaded(true);
}
}, [selectedOption]);
return (
@@ -362,29 +367,31 @@ const DNSSearchResults = (props) => {
</ul>
</div>
</div>
<div id="recordCountSelect" className="govuk-grid-row">
<div className="govuk-form-group">
<label className="govuk-label-s " htmlFor="sort">
{t("search:searchresults-show-records-label-a")}
<select
onChange={(e) => {
setSelectedOption(e.target.value);
}}
value={selectedOption}
className="govuk-select"
id="showNumberOfRecords"
name="showNumberOfRecords"
>
<option value="5">5</option>
<option value="10">10</option>
<option value="20">20</option>
<option value="30">30</option>
<option value="50">50</option>
</select>{" "}
{t("search:searchresults-show-records-label-b")}
</label>
{searchResultsObj["@odata.count"] > 5 && (
<div id="recordCountSelect" className="govuk-grid-row">
<div className="govuk-form-group">
<label className="govuk-label-s " htmlFor="sort">
{t("search:searchresults-show-records-label-a")}
<select
onChange={(e) => {
setSelectedOption(e.target.value);
}}
value={selectedOption}
className="govuk-select"
id="showNumberOfRecords"
name="showNumberOfRecords"
>
<option value="5">5</option>
<option value="10">10</option>
<option value="20">20</option>
<option value="30">30</option>
<option value="50">50</option>
</select>{" "}
{t("search:searchresults-show-records-label-b")}
</label>
</div>
</div>
</div>
)}
{resultsArr.length > 0 ? (
ResultsView(resultsArr)
) : (