fix: data borad list page pagination not fixed page bottom

-<script lang="ts" setup>
-  import { Image } from 'ant-design-vue';
-
-  const props = defineProps<{
-    value: {
-      src: string;
-    };
-  }>();
-</script>
-
-<template>
-  <section>
-    <Image
-      :src="
-        props?.value?.src ||
-        'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png'
-      "
-    />
-  </section>
-</template>
-
-<style></style>

@@ -11,8 +11,8 @@
   import { dateUtil } from '/@/utils/dateUtil';
 
   const props = defineProps<{
-    layout: PictureComponentLayout;
-    value: PictureComponentValue;
+    layout?: PictureComponentLayout;
+    value?: PictureComponentValue;
     radio: RadioRecord;
   }>();
 
@@ -21,14 +21,13 @@
 
   const getRadio = computed(() => {
     const { radio } = props.radio || DEFAULT_RADIO_RECORD;
-    console.log(props.radio);
     return radio;
   });
 
   const getWidth = computed(() => {
     const marign = 5;
     const { width = 180 } = props.radio || {};
-    return width - 5;
+    return width - marign;
   });
 </script>
 

@@ -14,12 +14,14 @@
   import { DataBoardRecord } from '/@/api/dataBoard/model';
   import { ViewType } from './config/panelDetail';
   import { useRouter } from 'vue-router';
+  import { getBoundingClientRect } from '/@/utils/domUtils';
 
   const ListItem = List.Item;
   const router = useRouter();
 
   const { createMessage, createConfirm } = useMessage();
 
+  const listEL = ref();
   const loading = ref(false);
   const dataBoardList = ref<DataBoardRecord[]>([]);
   //分页相关
@@ -118,8 +120,22 @@
     router.push(`/data/board/detail/${record.id}`);
   };
 
+  const handlePagenationPosition = () => {
+    const clientHeight = document.documentElement.clientHeight;
+    const rect = getBoundingClientRect(unref(listEL).$el!) as DOMRect;
+    const paginationHeight = 32 + 24 + 16;
+    const listContainerMarginBottom = 16;
+    const listContainerHeight =
+      clientHeight - rect.top - paginationHeight - listContainerMarginBottom;
+    const listContainerEl = (unref(listEL).$el as HTMLElement).querySelector(
+      '.ant-spin-nested-loading'
+    ) as HTMLElement;
+    listContainerEl && (listContainerEl.style.minHeight = listContainerHeight + 'px');
+  };
+
   onMounted(() => {
     getDatasource();
+    handlePagenationPosition();
   });
 </script>
 
@@ -131,6 +147,7 @@
     </div>
     <Spin :spinning="loading">
       <List
+        ref="listEL"
         :pagination="paginationProp"
         :data-source="dataBoardList"
         :grid="{ gutter: 5, column: 4, xs: 1, sm: 2, md: 2, lg: 3, xl: 3, xxl: 3 }"