refactor(crud): add pager component

frontend/js/views/BankAccountsView.vue

@@ -8,17 +8,13 @@
       </template>
     </Header>
 
-    <div class="d-flex justify-content-end gap-2 pe-3 pb-2">
-      <BPagination v-model="page" size="sm" :per-page="limit" :total-rows="limit*pages" @page-click="updatePage" class="m-0" />
-      <BFormSelect
-        v-model="limit"
-        :options="limits"
-        @change="updateLimit"
-        style="width: 70px"
-        size="sm"
-        :required="true"
-      />
-    </div>
+    <Pager
+      v-model:page="page"
+      v-model:pages="pages"
+      v-model:limit="limit"
+      @update="refresh()"
+    />
+
     <div class="crud-list">
       <BTableSimple caption-top responsive v-if="data !== null">
         <BThead>
@@ -90,12 +86,11 @@ import {
   BFormInput,
   BAlert,
   BButtonToolbar,
-  BPagination,
-  BFormSelect,
 } from 'bootstrap-vue-next'
 
 import SortButton from './../components/SortButton.vue'
 import Header from './../components/crud/Header.vue'
+import Pager from './../components/crud/Pager.vue'
 import { ref, onMounted, reactive, watch } from 'vue'
 import { getStorage, saveStorage, removeStorage } from '../lib/storage'
 import { defineLimits } from '../lib/limit'