打印图片

src/views/bookShelf/components/PrintModel.vue

@@ -182,16 +182,24 @@
                     :key="indexI"
                     style="text-align: center"
                   >
-                    <el-image
+                    <img
+                      @load="handleImageLoad($event, itemI)"
+                      :style="{
+                        width: itemI.width,
+                        height: itemI.height,
+                      }"
+                      :src="itemI.src"
+                    />
+                    <!-- <el-image
                       :src="itemI.src"
                       fit="contain"
                       :style="{
-                        width: itemI.width + 'px',
-                        height: itemI.height + 'px',
+                        width: itemI.width,
+                        height: itemI.height,
                       }"
                       :preview-src-list="[itemI.src]"
                       @load="handleImageLoad($event, itemI)"
-                    ></el-image>
+                    ></el-image> -->
                   </figure>
                 </template>
               </div>
@@ -731,16 +739,24 @@
                   :key="indexI"
                   style="text-align: center"
                 >
-                  <el-image
+                  <img
+                    @load="handleImageLoad($event, itemI)"
+                    :style="{
+                      width: itemI.width,
+                      height: itemI.height,
+                    }"
+                    :src="itemI.src"
+                  />
+                  <!-- <el-image
                     :src="itemI.src"
                     fit="contain"
                     :style="{
-                      width: itemI.width + 'px',
-                      height: itemI.height + 'px',
+                      width: itemI.width,
+                      height: itemI.height,
                     }"
                     :preview-src-list="[itemI.src]"
-                    @load="handleImageLoad($event, itemI)"
-                  ></el-image>
+                    
+                  ></el-image> -->
                 </figure>
               </template>
             </div>
@@ -1773,12 +1789,17 @@ export default {
       });
     },
     handleImageLoad(event, item) {
-      if (!item.width) {
-        item.width = event.target.naturalWidth;
+      if (!item.width || item.width > 870) {
+        item.width =
+          event.target.naturalWidth > 870
+            ? 870 + "px"
+            : event.target.naturalWidth + "px";
       }
       if (!item.height) {
-        item.height = event.target.naturalHeight;
+        item.height =
+          item.width === "870px" ? "" : event.target.naturalHeight + "px";
       }
+      this.$forceUpdate();
     },
   },
   mounted() {
@@ -2205,6 +2226,9 @@ export default {
 :deep .image img {
   max-width: 100%;
 }
+:deep figure {
+  margin: 1em 0;
+}
 </style>
 <style lang="scss">
 .item-page {

src/views/bookShelf/index.vue

@@ -560,7 +560,7 @@ export default {
   },
   //生命周期 - 创建完成（可以访问当前this实例）
   created() {
-    console.log("2025-07-11");
+    console.log("2025-07-11-1");
     if (this.userMessage) {
       this.getNumber();
       this.getList();