| | |
| | | <div :class="{ 'hidden': hidden }" class="pagination-container">
|
| | | <el-pagination
|
| | | :background="background"
|
| | | v-model:current-page="currentPage"
|
| | | v-model:page-size="pageSize"
|
| | | v-model:currentPage="currentPage"
|
| | | v-model:pageSize="pageSize"
|
| | | :layout="layout"
|
| | | :page-sizes="pageSizes"
|
| | | :page-size-options="pageSizes"
|
| | | :pager-count="pagerCount"
|
| | | :total="total"
|
| | | @size-change="handleSizeChange"
|
| | |
| | | </template>
|
| | |
|
| | | <script setup>
|
| | | import { computed } from 'vue'
|
| | | import { scrollTo } from '@/utils/scroll-to'
|
| | |
|
| | | const props = defineProps({
|
| | |
| | | }
|
| | | })
|
| | |
|
| | | const emit = defineEmits();
|
| | | const emit = defineEmits()
|
| | | const currentPage = computed({
|
| | | get() {
|
| | | return props.page
|
| | |
| | | emit('update:limit', val)
|
| | | }
|
| | | })
|
| | |
|
| | | function handleSizeChange(val) {
|
| | | if (currentPage.value * val > props.total) {
|
| | | currentPage.value = 1
|
| | |
| | | scrollTo(0, 800)
|
| | | }
|
| | | }
|
| | |
|
| | | function handleCurrentChange(val) {
|
| | | emit('pagination', { page: val, limit: pageSize.value })
|
| | | if (props.autoScroll) {
|
| | | scrollTo(0, 800)
|
| | | }
|
| | | }
|
| | |
|
| | | </script>
|
| | |
|
| | | <style scoped>
|