birdpaper-ui/lib/pagination/src/hook.js

一个通用的 vue3 UI组件库。A common vue3 UI component library.

"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const vue = require("vue");
const prev_vue_vue_type_script_setup_true_name_PaginationPrev_lang = require("./components/prev.vue.js");
const next_vue_vue_type_script_setup_true_name_PaginationNext_lang = require("./components/next.vue.js");
const total_vue_vue_type_script_setup_true_name_PaginationTotal_lang = require("./components/total.vue.js");
const pager_vue_vue_type_script_setup_true_name_PaginationPager_lang = require("./components/pager.vue.js");
const jumper_vue_vue_type_script_setup_true_name_PaginationJumper_lang = require("./components/jumper.vue.js");
const sizes_vue_vue_type_script_setup_true_name_PaginationSizes_lang = require("./components/sizes.vue.js");
const util = require("../../utils/util.js");
const usePagination = (props, emits) => {
  const layoutMap = { prev: prev_vue_vue_type_script_setup_true_name_PaginationPrev_lang, next: next_vue_vue_type_script_setup_true_name_PaginationNext_lang, total: total_vue_vue_type_script_setup_true_name_PaginationTotal_lang, pager: pager_vue_vue_type_script_setup_true_name_PaginationPager_lang, jumper: jumper_vue_vue_type_script_setup_true_name_PaginationJumper_lang, sizes: sizes_vue_vue_type_script_setup_true_name_PaginationSizes_lang };
  const currentPage = vue.ref(props.current || 1);
  const currentPageSize = vue.ref(props.pageSize);
  const totalPagesNum = vue.ref(0);
  const setPage = (type, pageNum) => {
    let num = currentPage.value;
    type === "prev" ? num-- : type === "next" ? num++ : num = pageNum ?? 1;
    currentPage.value = num < 1 ? 1 : num > totalPagesNum.value ? totalPagesNum.value : num;
    return currentPage.value;
  };
  const sizeSizes = (pageSizes) => {
    currentPageSize.value = pageSizes;
    return currentPageSize.value;
  };
  vue.watchEffect(() => {
    totalPagesNum.value = Math.ceil(props.total / currentPageSize.value);
    if (currentPage.value > totalPagesNum.value) {
      setPage("page", totalPagesNum.value);
    }
  });
  const totalComponents = vue.computed(() => {
    return {
      bind: {
        value: props.total,
        tmpString: props.totalTmpString
      }
    };
  });
  const prevComponents = vue.computed(() => {
    return {
      bind: {
        text: props.prevText,
        disabled: currentPage.value === 1
      },
      eventName: "click",
      event: () => {
        const pages = setPage("prev");
        emits("update:current", pages);
        emits("page-change", pages);
      }
    };
  });
  const pagerComponents = vue.computed(() => {
    return {
      bind: {
        pages: totalPagesNum.value,
        maxPager: props.maxPager,
        currentPage: currentPage.value
      },
      eventName: "click",
      event: (page) => {
        const pages = setPage("page", page);
        emits("update:current", pages);
        emits("page-change", pages);
      }
    };
  });
  const jumperComponents = vue.computed(() => {
    return {
      bind: {
        pages: totalPagesNum.value,
        currentPage: currentPage.value,
        tmpString: props.jumperTmpString
      },
      eventName: "change",
      event: (page) => {
        const pages = setPage("page", page);
        emits("update:current", pages);
        emits("page-change", pages);
      }
    };
  });
  const nextComponents = vue.computed(() => {
    return {
      bind: {
        text: props.nextText,
        disabled: currentPage.value === totalPagesNum.value
      },
      eventName: "click",
      event: () => {
        const pages = setPage("next");
        emits("update:current", pages);
        emits("page-change", pages);
      }
    };
  });
  const sizesComponents = vue.computed(() => {
    return {
      bind: {
        currentSize: currentPageSize.value,
        sizesList: props.sizesList,
        tmpString: props.sizesTmpString
      },
      eventName: "change",
      event: (size) => {
        const sizes2 = sizeSizes(size);
        emits("update:pageSize", sizes2);
        emits("size-change", sizes2);
      }
    };
  });
  const componentsList = vue.computed(() => {
    try {
      const layoutList = props.layout.replace(/\s*/g, "").split(",") || [];
      if (layoutList.length === 0)
        return [];
      const components = [];
      const componentMap = {
        total: totalComponents.value,
        prev: prevComponents.value,
        next: nextComponents.value,
        pager: pagerComponents.value,
        jumper: jumperComponents.value,
        sizes: sizesComponents.value
      };
      layoutList.map((name) => {
        components.push({ name, component: layoutMap[name], ...componentMap[name] });
      });
      return components;
    } catch (error) {
      util.warn("Pagination", "Render componentsList failure");
    }
  });
  return {
    componentsList
  };
};
exports.usePagination = usePagination;