import React from 'react'
import { Pagination } from 'antd'
import classNames from 'classnames'
import Styles from './style.less'

export default (props) => {
  const { current, pageSize, total, onChange } = props

  const style = {
    marginTop: '1em',
    background: 'transparent',
  }

  const handleChange = (current) => {
    onChange(current)
  }

  const handleShowSizeChange = (current, pageSize) => {
    onChange(current, pageSize)
  }

  if (!total || total < 1) {
    return null
  }

  return (
    <div className={classNames(Styles['flex-right'])} style={style}>
      <div className={Styles['flex-right-item']}>
        <Pagination
          showSizeChanger
          current={current}
          pageSize={pageSize}
          total={total}
          onChange={handleChange}
          onShowSizeChange={handleShowSizeChange}
        />
      </div>
    </div>
  )
}
