Add page number

RISDEV-2961
digitalservicebund · Dec 18, 2023 · 1b52e6a · 1b52e6a
1 parent ea520ba
commit 1b52e6a
Show file tree

Hide file tree

Showing 5 changed files with 12 additions and 18 deletions.
diff --git a/frontend/src/components/ActiveCitationInput.vue b/frontend/src/components/ActiveCitationInput.vue
@@ -256,7 +256,7 @@ watch(
         @click="addActiveCitation"
       />
     </div>
-    <div v-if="searchResultsCurrentPage" class="mb-10 mt-20">
+    <div v-if="!searchRunning && searchResultsCurrentPage" class="mb-10 mt-20">
       <Pagination
         navigation-position="bottom"
         :page="searchResultsCurrentPage"
@@ -268,10 +268,7 @@ watch(
         />
       </Pagination>
     </div>
-    <div
-      v-if="searchRunning && !searchResultsCurrentPage"
-      class="mb-10 ml-40 mt-20"
-    >
+    <div v-if="searchRunning" class="mb-10 ml-40 mt-20">
       ... Suche läuft ...
     </div>
   </div>

diff --git a/frontend/src/components/EnsuingDecisionInputGroup.vue b/frontend/src/components/EnsuingDecisionInputGroup.vue
@@ -245,7 +245,7 @@ onMounted(() => {
       />
     </div>
 
-    <div v-if="searchResultsCurrentPage" class="mb-10 mt-20">
+    <div v-if="!searchRunning && searchResultsCurrentPage" class="mb-10 mt-20">
       <Pagination
         navigation-position="bottom"
         :page="searchResultsCurrentPage"
@@ -257,10 +257,7 @@ onMounted(() => {
         />
       </Pagination>
     </div>
-    <div
-      v-if="searchRunning && !searchResultsCurrentPage"
-      class="mb-10 ml-40 mt-20"
-    >
+    <div v-if="searchRunning" class="mb-10 ml-40 mt-20">
       ... Suche läuft ...
     </div>
   </div>

diff --git a/frontend/src/components/PreviousDecisionInputGroup.vue b/frontend/src/components/PreviousDecisionInputGroup.vue
@@ -216,7 +216,7 @@ onMounted(() => {
       />
     </div>
 
-    <div v-if="searchResultsCurrentPage" class="mb-10 mt-20">
+    <div v-if="!searchRunning && searchResultsCurrentPage" class="mb-10 mt-20">
       <Pagination
         navigation-position="bottom"
         :page="searchResultsCurrentPage"
@@ -228,10 +228,7 @@ onMounted(() => {
         />
       </Pagination>
     </div>
-    <div
-      v-if="searchRunning && !searchResultsCurrentPage"
-      class="mb-10 ml-40 mt-20"
-    >
+    <div v-if="searchRunning" class="mb-10 ml-40 mt-20">
       ... Suche läuft ...
     </div>
   </div>

diff --git a/frontend/src/components/SearchResultList.vue b/frontend/src/components/SearchResultList.vue
@@ -21,7 +21,7 @@ export type SearchResults<Type extends RelatedDocumentation> = {
 <template>
   <div>
     <span v-if="!searchResults?.length" class="ds-label-01-bold"
-      >Suche hat keine Treffer ergeben</span
+      >Die Suche hat keine Treffer ergeben</span
     >
     <div class="mt-16 table">
       <div

diff --git a/frontend/src/shared/components/Pagination.vue b/frontend/src/shared/components/Pagination.vue
@@ -29,12 +29,11 @@ async function previousPage() {
 export type Page<T> = {
   content: T[]
   size: number
-  totalElements: number
-  totalPages: number
   number: number
   numberOfElements: number
   first: boolean
   last: boolean
+  empty: boolean
 }
 
 export type PageableService<TResult, TQuery = TResult> = (
@@ -61,6 +60,10 @@ export type PageableService<TResult, TQuery = TResult> = (
           <IconArrowBack />
           <span class="underline">zurück</span>
         </PaginationButton>
+        <span v-if="!page?.empty">
+          {{ page.numberOfElements }} Ergebniss(e) auf Seite
+          {{ page.number + 1 }}
+        </span>
         <PaginationButton
           aria-label="nächste Ergebnisse"
           :disabled="page?.last"