blackicedbear/FHC-Core
1
0
Fork 0
mirror of https://github.com/FH-Complete/FHC-Core.git synced 2026-07-04 20:39:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor(Paginatino.js): makes the pagionation component responsive on mobile displays

Browse Source
This commit is contained in:
SimonGschnell
2024-11-29 10:57:14 +01:00
parent 021a140dd3
commit 9cf6036926
2 changed files with 13 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/js/components/Cis/Cms/News.js
+3 -2
View File
@@ -37,7 +37,8 @@ export default {
template: /*html*/ `
<h2 >News</h2>
<hr/>
<pagination :page_size="page_size" @page="loadNewPageContent" :maxPageCount="maxPageCount">
<pagination :page_size="page_size" @page="loadNewPageContent" :maxPageCount="maxPageCount">
</pagination>
<div v-html="content"></div>
</pagination>`,
`,
};
public/js/components/Pagination/Pagination.js
+10 -6
View File
@@ -23,11 +23,15 @@ export default {
},
mounted() {},
template: /*html*/ `
<paginator v-model:rows="page_size" @page="(data)=>$emit('page',{...data, page:data.page+1})" :rows="page_size" :totalRecords="maxPageCount" :rowsPerPageOptions="[10, 20, 30]" ></paginator>
<slot>
Placeholder
</slot>
<!-- Desktop -->
<div class="d-none d-md-block">
<paginator v-model:rows="page_size" @page="(data)=>$emit('page',{...data, page:data.page+1})" :rows="page_size" :totalRecords="maxPageCount" :rowsPerPageOptions="[10, 20, 30]" >
</paginator>
</div>
<!-- Mobile -->
<div class="d-block d-md-none">
<paginator v-model:rows="page_size" @page="(data)=>$emit('page',{...data, page:data.page+1})" :rows="page_size" :totalRecords="maxPageCount" :rowsPerPageOptions="[10, 20, 30]" template="FirstPageLink PrevPageLink CurrentPageReport NextPageLink LastPageLink RowsPerPageDropdown">
</paginator>
</div>
`,
};