切换win

src/view/rai_pj/raiReportDtl.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="raiReportDtl_container" v-show="haveData">
+  <div class="raiReportDtl_container" v-show="haveData" :class="reportInfo.IsResearch?'no-cv':''" >
     <div class="seearch-top" v-if="from_type == 'mpwechat'">
       <div class="search-summary" @click="btnSearch">
         <van-icon color="#8D8D8D" size="18" name="search" />
@@ -186,7 +186,6 @@ export default {
           forbidClick: true,
         })
       const res = await RaiApi.articlePdfwatermark({ArticleId:Number(this.id)})
-      console.log(res);
       if(res.Ret===200){
         Toast.clear()
         wx.miniProgram.navigateTo({
@@ -281,6 +280,9 @@ export default {
               //有访问权限
               this.reportInfo = res.Data.Detail;
               this.fileLink = res.Data.Detail.FileLink;
+              if(this.reportInfo.IsBelongSummary){
+                this.waterMark(res.Data.Mobile)
+              }
               $(document).on("click", "#report-content img", function(event) {
                 let imgArray = [];
                 let src_tag = $(this).attr("src");
@@ -290,7 +292,6 @@ export default {
                     let itemSrc = $(this).attr("src");
                     imgArray.push(itemSrc);
                   });
-                  console.log(imgArray);
                   wx.previewImage({ current: src_tag, urls: imgArray });
                 }
               });
@@ -307,6 +308,9 @@ export default {
               //有访问权限
               this.reportInfo = res.Data.Detail;
               this.fileLink = res.Data.Detail.FileLink;
+               if(this.reportInfo.IsBelongSummary){
+                this.waterMark(res.Data.Mobile)
+              }
               $(document).on("click", "#report-content img", function(event) {
                 let imgArray = [];
                 let src_tag = $(this).attr("src");
@@ -398,6 +402,56 @@ export default {
         }
       });
     },
+    waterMark(key) {
+      var text = key;
+      var shuiyinDiv = document.createElement("div");
+      var style = shuiyinDiv.style;
+      style.position = "fixed";
+      style.left = 0;
+      style.top = "-10%";
+      style.width = "200%";
+      style.height = "200%";
+      style.opacity = "0.1";
+      style.background = "url(" + this.textBecomeImg(text, 22, "gray") + ")";
+      style.zIndex = 9999999991;
+      style.transform = "translateX(-100px) rotate(-30deg)";
+      style.pointerEvents = "none";
+      document.body.appendChild(shuiyinDiv);
+    },
+    textBecomeImg(text, fontsize, fontcolor) {
+      var canvas = document.createElement("canvas");
+      let  buHeight = 0;
+      if (fontsize <= 32) {
+        buHeight = 99;
+      } else if (fontsize > 32 && fontsize <= 60) {
+        buHeight = 2;
+      } else if (fontsize > 60 && fontsize <= 80) {
+        buHeight = 4;
+      } else if (fontsize > 80 && fontsize <= 100) {
+        buHeight = 6;
+      } else if (fontsize > 100) {
+        buHeight = 10;
+      }
+      canvas.height = fontsize + buHeight;
+      canvas.padding = 310;
+      var context = canvas.getContext("2d");
+      context.clearRect(0, 0, canvas.width * 2, canvas.height);
+      context.fillStyle = fontcolor;
+      context.font = fontsize + "px Arial";
+      context.textAlign = "center";
+      context.textBaseline = "middle";
+      context.fillText(text, 0, fontsize / 2);
+      var canvasWidth = canvas.width / 99;
+      canvasWidth = context.measureText(text).width;
+      canvas.width = 160;
+      canvas.height = 140;
+      context.fillStyle = fontcolor;
+      context.font = fontsize + "px Arial";
+      context.textBaseline = "middle";
+      context.fillText(text, 0, fontsize / 2);
+      var dataUrl = canvas.toDataURL("image/png");
+      return dataUrl;
+    },
     checkUa() {
       // iPhone X、iPhone XS
       let isIPhoneX =
@@ -528,6 +582,25 @@ export default {
     font-size: 17px !important;
   }
 }
+.no-cv {
+    -webkit-user-select: none;
+    -khtml-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+#report-content ,strong{
+  word-break:break-all ;
+}
+pre {
+    width: 100%;
+    overflow-y: auto;
+    overflow-x: hidden;
+    outline: none;
+    border: 0;
+    white-space: pre-wrap;
+    word-break: normal;
+}
 .seearch-top {
   width: 100%;
   padding: 0.6rem;