代码优化等

src/views/IM/chain-history/detail.vue

@@ -9,11 +9,20 @@
                <div>{{item.info}}</div>
            </div>
            <div v-if="item.type == 1" class="img-content" v-viewer>
-              <img-size 
+              <div class="img-box">
+                <img
+                  class="img"
+                  :src="item.url"
+                  :style="{width: item.newW + 'px', height: item.newH + 'px' }"
+                  alt
+                />
+              </div>
+
+              <!-- <img-size 
               :imgUrl="item.url"
               :imgData="item" 
               :index="index" 
-              @imgHandle="imgHandle"></img-size>
+              @imgHandle="imgHandle"></img-size> -->
             </div>
            <div v-if="item.type == 2" class="file-content">
              <div class="file-con" @click="openPDF(item.url)">
@@ -62,6 +71,7 @@ export default {
   },
   // 挂载到Dom完成时
   mounted() {
+    console.log('@@@@@@@@ in 挂载到Dom完成时 GJY');
     commonUtil.resizeHeight(92);
     this.getData();
     
@@ -76,6 +86,9 @@ export default {
         if (res.code == "000000") {
           this.detailData = res.data;
           this.detailData.contentModelList.map((item) => {
+            if(item.type == 1) {
+              this.imgSizeHandleNew(item, item.width, item.height);
+            }
             if(item.type == 2) {  // 0 文本 1 图片 2PDF  3链接
               item.fileSize = betaHandle(item.fileSize);
             }
@@ -87,6 +100,50 @@ export default {
       this.$set(this.detailData.contentModelList[data.index], 'newW', data.width)
       this.$set(this.detailData.contentModelList[data.index], 'newH', data.height)
     },
+
+    // 图片处理-新
+    imgSizeHandleNew(item, imgWidth, imgHeight) {
+      let lw, lh, newW, newH, imgProportion = (imgWidth / imgHeight).toFixed(1);
+      if (imgProportion > 0.6) {
+        if (imgWidth > 192) {
+          lw = 192;
+          lh = (imgHeight * lw) / imgWidth;
+        } else if (imgWidth <= 192) {
+          lw = imgWidth;
+          lh = imgHeight;
+        }
+      } else if (imgProportion == 0.6) {
+        if (imgHeight > 320) {
+          lh = 320;
+        } else {
+          lh = imgHeight;
+        }
+        lw = lh * 0.6;
+      } else {
+        if (imgHeight > 320) {
+          lh = 320;
+          lw = (imgWidth * lh) / imgHeight;
+        } else if (imgHeight <= 320) {
+          lh = imgHeight;
+          lw = imgWidth;
+        }
+      }
+      if (lh < 32 && lh < lw) {
+        newH = 32;
+        newW = (lw * 32) / lh;
+      } else if (lw < 32 && lw < lh) {
+        newW = 32;
+        newH = (lh * 32) / lw;
+      } else {
+        newH = lh;
+        newW = lw;
+      }
+      item.newW = newW;
+      item.newH = newH;
+      // this.$set(item, "newW", newW);
+      // this.$set(item, "newH", newH);
+    },
+
     // 下载目标文件
     downFile() {
       let a = document.createElement('a');
@@ -129,6 +186,12 @@ export default {
       padding: 16px 0;
       border-bottom: 1px solid #F0F1F2;
       cursor: pointer;
+      .img-box {
+        max-width: 192px;
+        max-height: 320px;
+        overflow: hidden;
+      }
+
       // .img-box {
       //   max-width: 192px;
       //   max-height: 320px;

src/views/IM/search-message/detail.vue

@@ -22,11 +22,9 @@
 						</div>
 						<div v-if="item.type == 'PICTURE'" class="img-content" v-viewer>
 							<!-- <img :src="item.content.url" /> -->
-							<div class="img-handle-container">
-								<div class="img-box">
-									<img :src="item.content.url" :style="{width: item.newW + 'px', height: item.newH + 'px'}"/>
-								</div>
-							</div>							
+							<div class="img-box">
+								<img :src="item.content.url" :style="{width: item.newW + 'px', height: item.newH + 'px'}"/>
+							</div>
 							<!-- <img-size
 							:imgUrl="item.content.url"
 							:imgData="item" 
@@ -364,12 +362,10 @@ export default {
 				.img-content {
 					padding: 10px 0 16px;
 					cursor: pointer;
-					.img-handle-container {
-						.img-box {
-							max-width: 192px;
-							max-height: 320px;
-							overflow: hidden;
-						}
+					.img-box {
+						max-width: 192px;
+						max-height: 320px;
+						overflow: hidden;
 					}
 				}
 				.file-content {