docs(pager): optimize pager demos (#3612)

This commit is contained in:
gimmyhehe 2025-07-25 15:36:27 +08:00 committed by GitHub
parent 875322c4e4
commit 6b27c3076a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
11 changed files with 11 additions and 37 deletions

View File

@ -1,7 +1,7 @@
<template>
<tiny-pager mode="number" :page-size="5" :page-sizes="[5, 7, 10, 20, 50]" :total="100"> </tiny-pager>
<tiny-pager mode="number" :page-size="20" :page-sizes="[10, 20, 50, 100]" :total="100"> </tiny-pager>
</template>
<script setup>
import { TinyPager, TinyModal } from '@opentiny/vue'
import { TinyPager } from '@opentiny/vue'
</script>

View File

@ -7,7 +7,7 @@ test('每页显示数量', async ({ page }) => {
const preview = page.locator('#page-size')
const pager = preview.locator('.tiny-pager')
const total = 100
const initPageSize = 5
const initPageSize = 20
const getPageCount = (pageSize: number) => String(Math.ceil(total / pageSize))
const sizeChange = pager.locator('.tiny-pager__page-size')
const sizeSelect = page.locator('.tiny-pager__selector')

View File

@ -1,9 +1,9 @@
<template>
<tiny-pager mode="number" :page-size="5" :page-sizes="[5, 7, 10, 20, 50]" :total="100"> </tiny-pager>
<tiny-pager mode="number" :page-size="20" :page-sizes="[10, 20, 50, 100]" :total="100"> </tiny-pager>
</template>
<script>
import { TinyPager, TinyModal } from '@opentiny/vue'
import { TinyPager } from '@opentiny/vue'
export default {
components: {

View File

@ -27,7 +27,6 @@
:current-page="custPager.currentPage"
:page-size="custPager.pageSize"
:total="custPager.total"
:page-sizes="[5, 10, 20, 50]"
@current-change="currentChange"
@size-change="sizeChange"
layout="total, sizes, prev, pager, next, jumper"

View File

@ -27,7 +27,6 @@
:current-page="custPager.currentPage"
:page-size="custPager.pageSize"
:total="custPager.total"
:page-sizes="[5, 10, 20, 50]"
@current-change="currentChange"
@size-change="sizeChange"
layout="total, sizes, prev, pager, next, jumper"

View File

@ -1,11 +1,5 @@
<template>
<tiny-pager
:popper-append-to-body="false"
layout="sizes,prev, pager, next"
:page-size="5"
:page-sizes="[5, 10, 20, 30, 40, 50, 100]"
:total="50"
></tiny-pager>
<tiny-pager :popper-append-to-body="false" layout="sizes,prev, pager, next" :total="50"></tiny-pager>
</template>
<script setup>

View File

@ -1,11 +1,5 @@
<template>
<tiny-pager
:popper-append-to-body="false"
layout="sizes,prev, pager, next"
:page-size="5"
:page-sizes="[5, 10, 20, 30, 40, 50, 100]"
:total="50"
></tiny-pager>
<tiny-pager :popper-append-to-body="false" layout="sizes,prev, pager, next" :total="50"></tiny-pager>
</template>
<script>

View File

@ -1,11 +1,5 @@
<template>
<tiny-pager
popper-class="custom-pager"
layout="sizes,prev, pager, next"
:page-size="5"
:page-sizes="[5, 10, 20, 30, 40, 50, 100]"
:total="50"
></tiny-pager>
<tiny-pager popper-class="custom-pager" layout="sizes,prev, pager, next" :total="50"></tiny-pager>
</template>
<script setup>

View File

@ -1,11 +1,5 @@
<template>
<tiny-pager
popper-class="custom-pager"
layout="sizes,prev, pager, next"
:page-size="5"
:page-sizes="[5, 10, 20, 30, 40, 50, 100]"
:total="50"
></tiny-pager>
<tiny-pager popper-class="custom-pager" layout="sizes,prev, pager, next" :total="50"></tiny-pager>
</template>
<script>

View File

@ -1,4 +1,4 @@
<svg viewBox="0 8 24 24" xmlns="http://www.w3.org/2000/svg"
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"
isSvg="true">
<path
d="M20.53 7.47a.75.75 0 0 0-.976-.073l-.084.073L12 14.939l-7.47-7.47a.75.75 0 0 0-.976-.072l-.084.073a.75.75 0 0 0-.073.976l.073.084 8 8a.75.75 0 0 0 .976.073l.084-.073 8-8a.75.75 0 0 0 0-1.06Z"

Before

Width:  |  Height:  |  Size: 315 B

After

Width:  |  Height:  |  Size: 315 B

View File

@ -1,4 +1,4 @@
<svg viewBox="0 -8 24 24" xmlns="http://www.w3.org/2000/svg"
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"
isSvg="true">
<path
d="M3.47 16.53a.75.75 0 0 0 .976.073l.084-.073L12 9.061l7.47 7.47a.75.75 0 0 0 .976.072l.084-.073a.75.75 0 0 0 .073-.976l-.073-.084-8-8a.75.75 0 0 0-.976-.073l-.084.073-8 8a.75.75 0 0 0 0 1.06Z"

Before

Width:  |  Height:  |  Size: 316 B

After

Width:  |  Height:  |  Size: 315 B