docs: add documentation for the pagination component

packages/vue-docs/docs/.vitepress/config.ts

@@ -48,6 +48,7 @@ export default defineConfig({
               { text: "Table", link: "/components/data-display/table/" },
               { text: "Tag", link: "/components/data-display/tag/" },
               { text: "Tooltip", link: "/components/data-display/tooltip/" },
+              { text: "Pagination", link: "/components/data-display/pagination/" },
             ],
           },
           {

packages/vue-docs/docs/components/data-display/pagination/ShowCaseBaseUsage.vue

@@ -0,0 +1,27 @@
+<script setup lang="ts">
+import { ref } from "vue";
+import { UniPagination } from "unify-ui";
+
+const total = ref(100);
+const pageSize = ref(10);
+const current = ref(1);
+
+function handleChange(params: { current: number; pageSize: number }) {
+  console.log(params);
+  current.value = params.current;
+  pageSize.value = params.pageSize;
+}
+</script>
+
+<template>
+  <div>total: {{ total }}</div>
+  <div>pageSize: {{ pageSize }}</div>
+  <div>current: {{ current }}</div>
+
+  <UniPagination
+    :total="total"
+    :page-size="pageSize"
+    :current="current"
+    @chagne="handleChange"
+  ></UniPagination>
+</template>

packages/vue-docs/docs/components/data-display/pagination/index.md

@@ -0,0 +1,35 @@
+<script setup lang='ts'>
+import ShowCaseBaseUsage from './ShowCaseBaseUsage.vue'
+</script>
+
+# Pagination
+
+## Basic Usage
+
+::: raw
+<ShowCaseBaseUsage />
+:::
+
+::: details View Source
+<<< @/components/data-display/pagination/ShowCaseBaseUsage.vue
+:::
+
+## API
+
+### Properties
+
+```ts
+defineProps<{
+  total: number;
+  pageSize: number;
+  current: number;
+}>();
+```
+
+### Events
+
+```ts
+const emits = defineEmits<{
+  (e: "chagne", params: { current: number; pageSize: number }): void;
+}>();
+```