hzzt-plus 0.0.2-dev-04 → 0.0.2-dev-05

package/es/components/page-size/index.mjs

@@ -0,0 +1,8 @@
+import '../../utils/index.mjs';
+import PageSize from './src/index.mjs';
+import { withInstall } from '../../utils/vue/install.mjs';
+
+const HzztPageSize = withInstall(PageSize);
+
+export { HzztPageSize, HzztPageSize as default };
+//# sourceMappingURL=index.mjs.map

package/es/components/page-size/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../../../../packages/components/page-size/index.ts"],"sourcesContent":["import { withInstall } from '@hzzt-plus/utils'\n\nimport PageSize from './src/index.vue'\n\nexport const HzztPageSize = withInstall(PageSize)\nexport default HzztPageSize\n"],"names":[],"mappings":";;;;AAEY,MAAC,YAAY,GAAG,WAAW,CAAC,QAAQ;;;;"}

package/es/components/page-size/src/index.mjs

@@ -0,0 +1,156 @@
+import { defineComponent, ref, computed, watch, resolveComponent, openBlock, createElementBlock, normalizeClass, unref, toDisplayString, createCommentVNode, createElementVNode, createVNode, withCtx, Fragment, renderList, createBlock } from 'vue';
+import { ElSelect, ElButton, ElInputNumber } from 'element-plus';
+import '../../../hooks/index.mjs';
+import HzztIcon from '../../icon/src/index.mjs';
+import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import { useSizeProp } from '../../../hooks/use-size/index.mjs';
+import { useLocale } from '../../../hooks/use-locale/index.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
+
+const _hoisted_1 = {
+  key: 0,
+  style: { "white-space": "nowrap" }
+};
+const _hoisted_2 = {
+  key: 1,
+  style: { "white-space": "nowrap" }
+};
+const _hoisted_3 = { class: "line-height-1" };
+const _hoisted_4 = {
+  key: 0,
+  class: "margin-l-1 margin-r-2"
+};
+const __default__ = defineComponent({
+  name: "HzztPageSize"
+});
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: {
+    modelValue: {
+      type: Number,
+      default: 1
+    },
+    pageSize: {
+      type: Number,
+      default: 20
+    },
+    total: {
+      type: Number,
+      default: 0
+    },
+    disabled: Boolean,
+    isManual: Boolean,
+    isLastPage: Boolean,
+    pageSizeOptions: {
+      type: Array,
+      default: () => [20, 50, 100, 200, 500, 1e3, 2e3]
+    },
+    size: useSizeProp
+  },
+  emits: [
+    "page-size-change",
+    "update:modelValue",
+    "current-change"
+  ],
+  setup(__props, { emit }) {
+    const props = __props;
+    const sizeValue = ref(props.pageSize);
+    const innerPage = ref(props.modelValue || 0);
+    const { t } = useLocale();
+    const ns = useNamespace("page-size");
+    const compKls = computed(() => {
+      return [ns.b(), ns.m(props.size)];
+    });
+    const page = computed(() => Math.ceil(props.total / props.pageSize));
+    watch(() => props.pageSize, (val) => {
+      sizeValue.value = val;
+    });
+    watch(() => props.modelValue, (val) => {
+      innerPage.value = val;
+    });
+    function pageSizeChange(size) {
+      emit("page-size-change", size);
+    }
+    function currentChange(page2) {
+      emit("update:modelValue", page2);
+      emit("current-change", page2);
+    }
+    return (_ctx, _cache) => {
+      const _component_el_option = resolveComponent("el-option");
+      return openBlock(), createElementBlock("main", {
+        class: normalizeClass([unref(compKls), "flex wrap align-items-center justify-content-end"])
+      }, [
+        __props.total > 0 && !__props.isManual ? (openBlock(), createElementBlock("span", _hoisted_1, toDisplayString(unref(t)("pageSize.total")) + toDisplayString(__props.total) + toDisplayString(unref(t)("pageSize.strip")), 1)) : createCommentVNode("v-if", true),
+        __props.isManual ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(unref(t)("pageSize.d")) + toDisplayString(__props.modelValue) + toDisplayString(unref(t)("pageSize.page")), 1)) : createCommentVNode("v-if", true),
+        __props.pageSizeOptions.length ? (openBlock(), createElementBlock("div", {
+          key: 2,
+          class: normalizeClass([_ctx.e("option"), "flex align-items-center"])
+        }, [
+          createElementVNode("span", _hoisted_3, toDisplayString(unref(t)("lang.per_page")), 1),
+          createVNode(unref(ElSelect), {
+            modelValue: sizeValue.value,
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => sizeValue.value = $event),
+            disabled: __props.disabled,
+            size: __props.size,
+            clearable: false,
+            onChange: pageSizeChange
+          }, {
+            default: withCtx(() => [
+              (openBlock(true), createElementBlock(Fragment, null, renderList(__props.pageSizeOptions, (item) => {
+                return openBlock(), createBlock(_component_el_option, {
+                  key: item,
+                  label: `${item}${unref(t)("pageSize.strip")}`,
+                  value: item
+                }, null, 8, ["label", "value"]);
+              }), 128))
+            ]),
+            _: 1
+          }, 8, ["modelValue", "disabled", "size"])
+        ], 2)) : createCommentVNode("v-if", true),
+        unref(page) > 1 || __props.isManual ? (openBlock(), createElementBlock("div", {
+          key: 3,
+          class: normalizeClass(_ctx.e("pagination"))
+        }, [
+          !__props.isManual ? (openBlock(), createElementBlock("span", _hoisted_4, toDisplayString(__props.modelValue) + "/" + toDisplayString(unref(page)), 1)) : createCommentVNode("v-if", true),
+          unref(page) > 2 && __props.modelValue > 2 ? (openBlock(), createBlock(unref(ElButton), {
+            key: 1,
+            type: "primary",
+            style: { "margin-right": "2px" },
+            size: __props.size,
+            onClick: _cache[1] || (_cache[1] = ($event) => currentChange(1))
+          }, {
+            default: withCtx(() => [
+              createVNode(HzztIcon, { name: "d-arrow-left" })
+            ]),
+            _: 1
+          }, 8, ["size"])) : createCommentVNode("v-if", true),
+          createVNode(unref(ElInputNumber), {
+            modelValue: innerPage.value,
+            "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => innerPage.value = $event),
+            class: "width-2",
+            size: __props.size,
+            min: 1,
+            max: unref(page),
+            onChange: currentChange
+          }, null, 8, ["modelValue", "size", "max"]),
+          unref(page) > 2 && __props.modelValue < unref(page) ? (openBlock(), createBlock(unref(ElButton), {
+            key: 2,
+            type: "primary",
+            style: { "margin-left": "2px" },
+            size: __props.size,
+            onClick: _cache[3] || (_cache[3] = ($event) => currentChange(unref(page)))
+          }, {
+            default: withCtx(() => [
+              createVNode(HzztIcon, { name: "d-arrow-right" })
+            ]),
+            _: 1
+          }, 8, ["size"])) : createCommentVNode("v-if", true)
+        ], 2)) : createCommentVNode("v-if", true)
+      ], 2);
+    };
+  }
+});
+var PageSize = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "index.vue"]]);
+
+export { PageSize as default };
+//# sourceMappingURL=index.mjs.map

package/es/components/page-size/src/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../../../../../packages/components/page-size/src/index.vue"],"sourcesContent":["<template>\n  <main\n    :class=\"compKls\"\n    class=\"flex wrap align-items-center justify-content-end\"\n  >\n    <span v-if=\"total > 0 && !isManual\" style=\"white-space: nowrap\"\n      >{{ t('pageSize.total') }}{{ total }}{{ t('pageSize.strip') }}</span\n    >\n    <span v-if=\"isManual\" style=\"white-space: nowrap\"\n      >{{ t('pageSize.d') }}{{ modelValue }}{{ t('pageSize.page') }}</span\n    >\n    <div\n      v-if=\"pageSizeOptions.length\"\n      :class=\"e('option')\"\n      class=\"flex align-items-center\"\n    >\n      <span class=\"line-height-1\">{{ t('lang.per_page') }}</span>\n      <el-select\n        v-model=\"sizeValue\"\n        :disabled=\"disabled\"\n        :size=\"size\"\n        :clearable=\"false\"\n        @change=\"pageSizeChange\"\n      >\n        <el-option\n          v-for=\"item in pageSizeOptions\"\n          :key=\"item\"\n          :label=\"`${item}${t('pageSize.strip')}`\"\n          :value=\"item\"\n        />\n      </el-select>\n    </div>\n    <div v-if=\"page > 1 || isManual\" :class=\"e('pagination')\">\n      <span v-if=\"!isManual\" class=\"margin-l-1 margin-r-2\"\n        >{{ modelValue }}/{{ page }}</span\n      >\n      <el-button\n        v-if=\"page > 2 && modelValue > 2\"\n        type=\"primary\"\n        style=\"margin-right: 2px\"\n        :size=\"size\"\n        @click=\"currentChange(1)\"\n      >\n        <hzzt-icon name=\"d-arrow-left\" />\n      </el-button>\n      <el-input-number\n        v-model=\"innerPage\"\n        class=\"width-2\"\n        :size=\"size\"\n        :min=\"1\"\n        :max=\"page\"\n        @change=\"currentChange\"\n      />\n      <el-button\n        v-if=\"page > 2 && modelValue < page\"\n        type=\"primary\"\n        style=\"margin-left: 2px\"\n        :size=\"size\"\n        @click=\"currentChange(page)\"\n      >\n        <hzzt-icon name=\"d-arrow-right\" />\n      </el-button>\n    </div>\n  </main>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, ref, watch } from 'vue'\nimport { ElButton, ElInputNumber, ElSelect } from 'element-plus'\nimport { useLocale, useNamespace, useSizeProp } from '@hzzt-plus/hooks'\nimport HzztIcon from '@hzzt-plus/components/icon/src/index.vue'\n\ndefineOptions({\n  name: 'HzztPageSize',\n})\n\nconst props = defineProps({\n  modelValue: {\n    type: Number,\n    default: 1,\n  },\n  pageSize: {\n    type: Number,\n    default: 20,\n  },\n  total: {\n    type: Number,\n    default: 0,\n  },\n  disabled: Boolean,\n  isManual: Boolean,\n  isLastPage: Boolean,\n  pageSizeOptions: {\n    type: Array,\n    default: () => [20, 50, 100, 200, 500, 1000, 2000],\n  },\n  size: useSizeProp,\n})\n\nconst emit = defineEmits([\n  'page-size-change',\n  'update:modelValue',\n  'current-change',\n])\n\nconst sizeValue = ref(props.pageSize)\nconst innerPage = ref(props.modelValue || 0)\nconst { t } = useLocale()\nconst ns = useNamespace('page-size')\n\nconst compKls = computed(() => {\n  return [ns.b(), ns.m(props.size)]\n})\n\nconst page = computed(() => Math.ceil(props.total / props.pageSize))\n\nwatch(\n  () => props.pageSize,\n  (val) => {\n    sizeValue.value = val\n  }\n)\n\nwatch(\n  () => props.modelValue,\n  (val) => {\n    innerPage.value = val\n  }\n)\n\nfunction pageSizeChange(size: number) {\n  emit('page-size-change', size)\n}\n\nfunction currentChange(page: number) {\n  emit('update:modelValue', page)\n  emit('current-change', page)\n}\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;mCAwEc,CAAA;AAAA,EACZ,IAAM,EAAA,cAAA;AACR,CAAA,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+BA,IAAM,MAAA,SAAA,GAAY,GAAI,CAAA,KAAA,CAAM,QAAQ,CAAA,CAAA;AACpC,IAAA,MAAM,SAAY,GAAA,GAAA,CAAI,KAAM,CAAA,UAAA,IAAc,CAAC,CAAA,CAAA;AAC3C,IAAM,MAAA,EAAE,MAAM,SAAU,EAAA,CAAA;AACxB,IAAM,MAAA,EAAA,GAAK,aAAa,WAAW,CAAA,CAAA;AAEnC,IAAM,MAAA,OAAA,GAAU,SAAS,MAAM;AAC7B,MAAO,OAAA,CAAC,GAAG,CAAE,EAAA,EAAG,GAAG,CAAE,CAAA,KAAA,CAAM,IAAI,CAAC,CAAA,CAAA;AAAA,KACjC,CAAA,CAAA;AAED,IAAM,MAAA,IAAA,GAAO,SAAS,MAAM,IAAA,CAAK,KAAK,KAAM,CAAA,KAAA,GAAQ,KAAM,CAAA,QAAQ,CAAC,CAAA,CAAA;AAEnE,IAAA,KAAA,CACE,MAAM,KAAA,CAAM,QACZ,EAAA,CAAC,GAAQ,KAAA;AACP,MAAA,SAAA,CAAU,KAAQ,GAAA,GAAA,CAAA;AAAA,KAEtB,CAAA,CAAA;AAEA,IAAA,KAAA,CACE,MAAM,KAAA,CAAM,UACZ,EAAA,CAAC,GAAQ,KAAA;AACP,MAAA,SAAA,CAAU,KAAQ,GAAA,GAAA,CAAA;AAAA,KAEtB,CAAA,CAAA;AAEA,IAAA,SAAA,cAAA,CAAwB,IAAc,EAAA;AACpC,MAAA,IAAA,CAAK,oBAAoB,IAAI,CAAA,CAAA;AAAA,KAC/B;AAEA,IAAA,SAAA,aAAA,CAAuB,KAAc,EAAA;AACnC,MAAA,IAAA,CAAK,qBAAqB,KAAI,CAAA,CAAA;AAC9B,MAAA,IAAA,CAAK,kBAAkB,KAAI,CAAA,CAAA;AAAA,KAC7B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}