From 1595cb282aab5399862fac6406b5de550863e3b6 Mon Sep 17 00:00:00 2001 From: 疯狂的狮子Li <15040126243@163.com> Date: 星期一, 03 四月 2023 00:05:09 +0800 Subject: [PATCH] update 调整代码格式 --- src/components/Pagination/index.vue | 164 +++++++++++++++++++++++++++--------------------------- 1 files changed, 82 insertions(+), 82 deletions(-) diff --git a/src/components/Pagination/index.vue b/src/components/Pagination/index.vue index 40bc584..de7b02c 100644 --- a/src/components/Pagination/index.vue +++ b/src/components/Pagination/index.vue @@ -1,6 +1,22 @@ +<template> + <div :class="{ 'hidden': hidden }" class="pagination-container"> + <el-pagination + :background="background" + v-model:current-page="currentPage" + v-model:page-size="pageSize" + :layout="layout" + :page-sizes="pageSizes" + :pager-count="pagerCount" + :total="total" + @size-change="handleSizeChange" + @current-change="handleCurrentChange" + /> + </div> +</template> + <script lang="ts"> export default { - name: 'Pagination' + name: 'Pagination' } </script> @@ -9,100 +25,84 @@ import { PropType } from "vue"; const props = defineProps({ - total: { - required: true, - type: Number - }, - page: { - type: Number, - default: 1 - }, - limit: { - type: Number, - default: 20 - }, - pageSizes: { - type: Array as PropType<number[]>, - default() { - return [10, 20, 30, 50] + total: { + required: true, + type: Number + }, + page: { + type: Number, + default: 1 + }, + limit: { + type: Number, + default: 20 + }, + pageSizes: { + type: Array as PropType<number[]>, + default() { + return [10, 20, 30, 50] + } + }, + // 绉诲姩绔〉鐮佹寜閽殑鏁伴噺绔粯璁ゅ��5 + pagerCount: { + type: Number, + default: document.body.clientWidth < 992 ? 5 : 7 + }, + layout: { + type: String, + default: 'total, sizes, prev, pager, next, jumper' + }, + background: { + type: Boolean, + default: true + }, + autoScroll: { + type: Boolean, + default: true + }, + hidden: { + type: Boolean, + default: false + }, + float: { + type: String, + default: 'right' } - }, - // 绉诲姩绔〉鐮佹寜閽殑鏁伴噺绔粯璁ゅ��5 - pagerCount: { - type: Number, - default: document.body.clientWidth < 992 ? 5 : 7 - }, - layout: { - type: String, - default: 'total, sizes, prev, pager, next, jumper' - }, - background: { - type: Boolean, - default: true - }, - autoScroll: { - type: Boolean, - default: true - }, - hidden: { - type: Boolean, - default: false - }, - float: { - type: String, - default: 'right' - } }) const emit = defineEmits(['update:page', 'update:limit', 'pagination']); const currentPage = computed({ - get() { - return props.page - }, - set(val) { - emit('update:page', val) - } + get() { + return props.page + }, + set(val) { + emit('update:page', val) + } }) const pageSize = computed({ - get() { - return props.limit - }, - set(val){ - emit('update:limit', val) - } + get() { + return props.limit + }, + set(val){ + emit('update:limit', val) + } }) function handleSizeChange(val: number) { - if (currentPage.value * val > props.total) { - currentPage.value = 1 - } - emit('pagination', { page: currentPage.value, limit: val }) - if (props.autoScroll) { - scrollTo(0, 800) - } + if (currentPage.value * val > props.total) { + currentPage.value = 1 + } + emit('pagination', { page: currentPage.value, limit: val }) + if (props.autoScroll) { + scrollTo(0, 800) + } } function handleCurrentChange(val: number) { - emit('pagination', { page: val, limit: pageSize.value }) - if (props.autoScroll) { - scrollTo(0, 800) - } + emit('pagination', { page: val, limit: pageSize.value }) + if (props.autoScroll) { + scrollTo(0, 800) + } } </script> - -<template> - <div :class="{ 'hidden': hidden }" class="pagination-container"> - <el-pagination - :background="background" - v-model:current-page="currentPage" - v-model:page-size="pageSize" - :layout="layout" - :page-sizes="pageSizes" - :pager-count="pagerCount" - :total="total" - @size-change="handleSizeChange" - @current-change="handleCurrentChange" - /> - </div> -</template> <style lang="scss" scoped> .pagination-container { -- Gitblit v1.9.3