From 295d04e1f38d8188c7863e563eb3787582d823d2 Mon Sep 17 00:00:00 2001
From: AKING <2734339436@qq.com>
Date: Wed, 23 Aug 2023 13:51:24 +0800
Subject: [PATCH] =?UTF-8?q?update=20src/components/Pagination/index.vue.?=
 =?UTF-8?q?=20=E8=A7=A3=E5=86=B3=E4=BA=86=E5=BD=93=E5=85=A8=E5=B1=80size?=
 =?UTF-8?q?=E4=B8=BAsmall=E7=9A=84=E6=97=B6=E5=80=99=E5=88=86=E9=A1=B5?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6=E6=A0=B7=E5=BC=8F=E5=A4=AA=E5=A4=A7=E7=9A=84?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98=EF=BC=8C=E5=BD=93=E7=BB=84=E4=BB=B6=E4=B8=BA?=
 =?UTF-8?q?small=E6=97=B6=EF=BC=8C=E5=88=99=E4=BC=9A=E6=98=BE=E7=A4=BA?=
 =?UTF-8?q?=E5=B0=8F=E7=9A=84=E5=88=86=E9=A1=B5=E7=BB=84=E4=BB=B6=EF=BC=8C?=
 =?UTF-8?q?=E5=85=B7=E4=BD=93=E8=AF=B7=E5=8F=82=E7=85=A7ep=E5=AE=98?=
 =?UTF-8?q?=E7=BD=91=EF=BC=9Ahttps://element-plus.org/zh-CN/component/pagi?=
 =?UTF-8?q?nation.html#%E9%99%84%E5%8A%A0%E5%8A%9F%E8%83%BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: AKING <2734339436@qq.com>

(cherry picked from commit ff8a8e7243402f8f8946deee56aae9b5e45496f4)
---
 src/components/Pagination/index.vue | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/src/components/Pagination/index.vue b/src/components/Pagination/index.vue
index 43112c55..b441981f 100644
--- a/src/components/Pagination/index.vue
+++ b/src/components/Pagination/index.vue
@@ -8,14 +8,26 @@
     :page-sizes="[10, 20, 30, 50, 100]"
     :pager-count="pagerCount"
     :total="total"
+    :small="isSmall"
     class="float-right mt-15px mb-15px"
     layout="total, sizes, prev, pager, next, jumper"
     @size-change="handleSizeChange"
     @current-change="handleCurrentChange"
   />
 </template>
-<script name="Pagination" setup>
-import { computed } from 'vue'
+<script lang="ts" setup>
+import { computed, watchEffect } from 'vue'
+import { useAppStore } from '@/store/modules/app'
+
+defineOptions({ name: 'Pagination' })
+
+// 此处解决了当全局size为small的时候分页组件样式太大的问题
+const appStore = useAppStore()
+const layoutCurrentSize = computed(() => appStore.currentSize)
+const isSmall = ref<boolean>(layoutCurrentSize.value === 'small')
+watchEffect(() => {
+  isSmall.value = layoutCurrentSize.value === 'small'
+})
 
 const props = defineProps({
   // 总条目数