plus-pro-components/es/components/pagination/src/index.vue2.mjs

Page level components developed based on Element Plus.

import { createElementVNode, defineComponent, ref, watchEffect, openBlock, createElementBlock, renderSlot, createCommentVNode, createVNode, unref, mergeProps } from 'vue';
import '../../../constants/index.mjs';
import { ElPagination } from 'element-plus';
import { DefaultPageInfo, DefaultPageSizeList } from '../../../constants/page.mjs';

const _hoisted_1 = { class: "plus-pagination" };
const _hoisted_2 = /* @__PURE__ */ createElementVNode(
  "span",
  null,
  null,
  -1
  /* HOISTED */
);
const _hoisted_3 = /* @__PURE__ */ createElementVNode(
  "span",
  null,
  null,
  -1
  /* HOISTED */
);
var _sfc_main = /* @__PURE__ */ defineComponent({
  ...{
    name: "PlusPagination"
  },
  __name: "index",
  props: {
    modelValue: { default: () => ({ ...DefaultPageInfo }) },
    total: { default: 0 },
    pageSizeList: { default: () => [...DefaultPageSizeList] },
    align: { default: "right" }
  },
  emits: ["update:modelValue", "change", "size-change", "current-change"],
  setup(__props, { emit: __emit }) {
    const props = __props;
    const emit = __emit;
    const pageInfo = ref({ ...DefaultPageInfo });
    watchEffect(() => {
      pageInfo.value = { ...props.modelValue };
    });
    const handleEmit = () => {
      emit("update:modelValue", pageInfo.value);
      emit("change", pageInfo.value);
    };
    const handleSizeChange = (pageSize) => {
      pageInfo.value.pageSize = pageSize;
      pageInfo.value.page = 1;
      handleEmit();
      emit("size-change", pageSize);
    };
    const handleCurrentChange = (page) => {
      pageInfo.value.page = page;
      handleEmit();
      emit("current-change", page);
    };
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1, [
        _ctx.align === "right" ? renderSlot(_ctx.$slots, "pagination-left", { key: 0 }, () => [
          _hoisted_2
        ]) : createCommentVNode("v-if", true),
        createVNode(unref(ElPagination), mergeProps({
          layout: "total, sizes, prev, pager, next, jumper",
          background: false,
          "current-page": pageInfo.value.page,
          "page-size": pageInfo.value.pageSize,
          total: _ctx.total,
          "page-sizes": _ctx.pageSizeList
        }, _ctx.$attrs, {
          onSizeChange: handleSizeChange,
          onCurrentChange: handleCurrentChange
        }), null, 16, ["current-page", "page-size", "total", "page-sizes"]),
        _ctx.align === "left" ? renderSlot(_ctx.$slots, "pagination-right", { key: 1 }, () => [
          _hoisted_3
        ]) : createCommentVNode("v-if", true)
      ]);
    };
  }
});

export { _sfc_main as default };