web-admin/src/hooks/table.ts

import { ref } from 'vue';
import { PageResult } from '@/api/types/common';

export default function useTable<T>(
  apiFunc: Promise<PageResult<T>>,
  searchModel: object,
  initAutoFetch = false
) {
  const pageNumber = ref(1);
  const pageSize = ref(10);
  const total = ref(0);
  const dataList = ref<T>([]);

  async function getList() {
    const datas = {
      ...searchModel,
      pageNumber: pageNumber.value,
      pageSize: pageSize.value,
    };
    const data = await apiFunc(datas);
    dataList.value = data.records;
    total.value = data.total;
  }
  if (initAutoFetch) getList();

  async function toPage(page: number) {
    pageNumber.value = page;
    await getList();
  }

  async function pageSizeChange(size: number) {
    pageSize.value = size;
    await toPage(1);
  }

  function getRowIndex(index) {
    return pageSize.value * (pageNumber.value - 1) + index + 1;
  }

  function deletePageLastItem(len = 1) {
    let page = pageNumber.value || 1;
    if (dataList.value.length === len) {
      page = page > 1 ? page - 1 : 1;
    }
    toPage(page);
  }

  const pagination = ref({
    total,
    current: pageNumber,
    pageSize,
    showTotal: true,
    showJumper: true,
    showPageSize: true,
    onChange: toPage,
    onPageSizeChange: pageSizeChange,
  });

  return {
    total,
    dataList,
    pagination,
    getRowIndex,
    getList,
    toPage,
    deletePageLastItem,
  };
}