导出

project/pidu/app/AppSessionArchive/components/Detail.vue

@@ -166,7 +166,7 @@
                 </div>
 
                 <div class="img-list" v-if="item.msgType == 'image'">
-                  <img :src="item.sdkFileUrl" alt="" v-viewer />
+                  <img :src="item.src" alt="" v-viewer />
                 </div>
 
                 <div class="voice-info" v-if="item.msgType == 'voice'">
@@ -188,7 +188,7 @@
 
                 <div class="revoke-text" v-if="item.msgType == 'revoke'">
                   {{ item.userName
-                  }}{{ item.msgSendTime.substring(0, 16) }}撤回了一条消息
+                  }}撤回了一条消息
                 </div>
 
                 <div class="revoke-text" v-if="item.msgType == 'disagree'">
@@ -285,14 +285,20 @@
   </ai-list>
 </template>
 
+<script src="https://cdn.bootcdn.net/ajax/libs/html2canvas/1.4.1/html2canvas.esm.js"></script>
+<script src="https://cdn.bootcdn.net/ajax/libs/jspdf/2.5.1/jspdf.es.js"></script>
+
 <script>
 import { mapState } from "vuex";
 import Viewer from "v-viewer";
 import AMapLoader from "@amap/amap-jsapi-loader";
 import Vue from "vue";
 Vue.use(Viewer);
+
+
 import html2canvas from "html2canvas";
 import jsPDF from "jspdf";
+
 import { Loading } from "element-ui";
 
 const PdfLoader = (ele, pdfFileName) => {
@@ -577,8 +583,12 @@ export default {
                 this.initMap(item.lng, item.lat, item.zoom, index);
               }
               if (item.msgType == "image") {
-                item.src = this.getBase64Image(item.sdkFileUrl);
-                console.log(item.src);
+                var image = new Image();
+                image.crossOrigin = '';
+                image.src = item.sdkFileUrl
+                image.onload = ()=>{
+                  item.src = this.getBase64Image(image);
+                }
               }
             });
             this.msgList =
@@ -606,28 +616,18 @@ export default {
           this.isLoading = false;
         });
     },
-    getBase64Image(url) {
-      function newImg(url) {
-        return new Promise((resolve, reject) => {
-          let image = new Image();
-          image.crossOrigin = "Anonymous";
-          image.src = url;
-          image.onload = function () {
-            resolve(image);
-          };
-        });
-      }
-      return newImg(url).then((img) => {
-        let canvas = document.createElement("canvas");
+    getBase64Image(img) {
+       var canvas = document.createElement("canvas");
         canvas.width = img.width;
         canvas.height = img.height;
-        let ctx = canvas.getContext("2d");
+
+        var ctx = canvas.getContext("2d");
         ctx.drawImage(img, 0, 0, img.width, img.height);
-        let ext = img.src.substring(img.src.lastIndexOf(".") + 1).toLowerCase();
-        let dataURL = canvas.toDataURL("image/" + ext);
+        var ext = img.src.substring(img.src.lastIndexOf(".")+1).toLowerCase();
+        var dataURL = canvas.toDataURL("image/"+ext);
         return dataURL;
-      });
     },
+    
     initMap(lng, lat, zoom, index) {
       AMapLoader.load({
         key: "54a02a43d9828a8f9cd4f26fe281e74e",