import lodash from 'lodash';
import { reactive } from 'vue';

const pagination = {
  current: 1,
  pageSize: 10,
  total: 0,
  showTotal: (total) => `共 ${total} 条数据`,
  getData: () => {},
  onChange: (page) => {},
  onShowSizeChange: (current, size) => {},
  size: 'small',
  showSizeChanger: true,
  pageSizeOptions: ['10', '50', '100'],
};

export const usePagination = (fun: () => void) => {
  const p = lodash.cloneDeep(pagination);
  p.getData = fun;
  p.onChange = (page) => {
    p.current = page;
    p.getData();
  };
  p.onShowSizeChange = (current, size) => {
    p.current = 1;
    p.pageSize = size;
    p.getData();
  };
  return reactive(p);
};
