smart-search-web/src/components/cus/CusPage.vue

<template>
  <el-pagination
    :current-page="pageNum"
    :page-size="pageSize"
    :page-sizes="pageSizes"
    layout="total, sizes, prev, pager, next, jumper"
    :total="total"
    size="small"
    @size-change="handleSizeChange"
    @current-change="handleCurrentChange"
  />
</template>

<script setup lang="ts">
defineOptions({
  name: 'CusPage',
});
import {getCurrentInstance, reactive} from "vue";

const {proxy} = getCurrentInstance()
const emit = defineEmits(['page'])
const props = defineProps({
  pageNum: {required: true},
  pageSize: {required: true},
  total: {required: true},
  pageSizes: {default: () => [10, 20, 30, 40, 50, 100]}
})
const state: any = reactive({})
const handleSizeChange = (val) => {
  emit('page', 1, val)
}
const handleCurrentChange = (val) => {
  emit('page', val, props.pageSize)
}
</script>

<style lang="scss" scoped>
</style>