fix 图片库存的样式优化

src/views/code/list/components/stock-image-modal.vue

@@ -4,21 +4,10 @@
         <div class="stock-image-container">
             <!-- 图片网格 -->
             <div v-if="imageList.length > 0" class="image-grid">
-                <div 
-                    v-for="(imageUrl, index) in imageList" 
-                    :key="index" 
-                    class="image-item"
-                    @click="handleImageClick(imageUrl, index)"
-                >
-                    <el-image
-                        :src="imageUrl"
-                        fit="cover"
-                        class="stock-image"
-                        :preview-src-list="imageList"
-                        :initial-index="index"
-                        :preview-teleported="true"
-                        @error="handleImageError"
-                    />
+                <div v-for="(imageUrl, index) in imageList" :key="index" class="image-item"
+                    @click="handleImageClick(imageUrl, index)">
+                    <el-image :src="imageUrl" fit="cover" class="stock-image" :preview-src-list="imageList"
+                        :initial-index="index" :preview-teleported="true" @error="handleImageError" />
                 </div>
             </div>
 
@@ -31,22 +20,16 @@
             <div v-if="loading" class="loading-state">
                 <el-skeleton :rows="3" animated />
             </div>
-
-            <!-- 分页 -->
-            <div v-if="total > 10" class="pagination-container">
-                <el-pagination
-                    v-model:current-page="currentPage"
-                    v-model:page-size="pageSize"
-                    :page-sizes="[12, 24, 48, 96]"
-                    :total="total"
-                    layout="total, sizes, prev, pager, next, jumper"
-                    @size-change="handleSizeChange"
-                    @current-change="handleCurrentChange"
-                />
-            </div>
         </div>
 
         <template #footer>
+            <!-- 分页 -->
+            <div class="pagination-container" v-if="total > 10">
+                <el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize"
+                    :page-sizes="[10, 20, 30, 40, 50, 100]" :total="total"
+                    layout="total, sizes, prev, pager, next" @size-change="handleSizeChange"
+                    @current-change="handleCurrentChange" />
+            </div>
             <el-button @click="handleCancel">关闭</el-button>
         </template>
     </ele-modal>
@@ -144,7 +127,7 @@ const handleOpen = (isbn) => {
         pageSize.value = 24;
         total.value = 0;
         imageList.value = [];
-        
+
         nextTick(() => {
             fetchStockImages();
         });
@@ -169,7 +152,8 @@ defineExpose({
 
 <style scoped>
 .stock-image-container {
-    min-height: 400px;
+    height: 400px;
+    overflow: auto;
 }
 
 .image-grid {
@@ -190,7 +174,6 @@ defineExpose({
 }
 
 .image-item:hover {
-    transform: scale(1.05);
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
 }
 
@@ -212,13 +195,10 @@ defineExpose({
 }
 
 .pagination-container {
-    position: sticky;
-    bottom: 0;
     background: white;
     display: flex;
     justify-content: center;
-    margin-top: 20px;
-    padding: 20px 0;
+    padding: 0 0;
     z-index: 10;
 }
 </style>