<script setup lang="ts">
defineProps<{ page: number; pageSize: number; total: number }>();
const emit = defineEmits<{ change: [page: number, pageSize: number] }>();

function changePage(page: number, pageSize: number) { emit("change", page, pageSize); }
function changeSize(pageSize: number) { emit("change", 1, pageSize); }
</script>

<template>
  <div class="admin-pagination">
    <el-pagination
      background
      :current-page="page"
      :page-size="pageSize"
      :page-sizes="[10, 20, 50, 100]"
      :total="total"
      layout="total, sizes, prev, pager, next, jumper"
      @current-change="changePage($event, pageSize)"
      @size-change="changeSize"
    />
  </div>
</template>
