docs(pager): optimize pager demos (#3612)
This commit is contained in:
parent
875322c4e4
commit
6b27c3076a
|
@ -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>
|
||||
|
|
|
@ -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')
|
||||
|
|
|
@ -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: {
|
||||
|
|
|
@ -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"
|
||||
|
|
|
@ -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"
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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 |
|
@ -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 |
Loading…
Reference in New Issue