<template>
    <el-pagination
        background
        align="right"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="pageResult.page"
        :page-sizes="[20, 50, 100, 200]"
        :page-size="pageResult.pageSize"
        layout="total, prev, pager, next, sizes, jumper"
        :total="pageResult.total"
    ></el-pagination>
</template>

<script>
export default {
    name: 'pagination',
    props: {
        pageResult: {
            typeof: Object,
            default: () => {
                return {
                    page: 1,
                    pageSize: 20,
                    total: 0,
                }
            },
        },
    },
    data() {
        return {}
    },
    methods: {
        handleSizeChange(val) {
            this.$emit('size-change', val)
        },
        handleCurrentChange(val) {
            this.$emit('current-change', val)
        },
    },
}
</script>

<style></style>
