Merge branch 'debug' of http://8.136.199.33:3000/eta_front/eta_report_front into debug

src/router/index.js

@@ -46,6 +46,11 @@ const routes=[
     name: "detailPdfEn",
     component: () => import("@/views/reportEn/detailPdf.vue"),
   },
+  {
+    path: "/reportshare_smart_pdf",
+    name: "detailSmartPdf",
+    component: () => import("@/views/smartReport/detailPdf.vue"),
+  },
   {
     path: "/reportshare_external",
     name: "reportshareExternal",

src/views/report/reportDetail.vue

@@ -71,7 +71,7 @@
       <div id="abstract">
         <div class="abstract_cont">
           <div v-if="reportInfo.Abstract">摘要：{{ reportInfo.Abstract }}</div>
-          <div style="color: #666; margintop: 1.2rem">
+          <div style="color: #666; margintop: 1.2rem" v-if="configInfo.Disclaimer">
             *注：请务必阅读&nbsp;<strong
               style="fontweight: normal; cursor: pointer; color: #3e8ce6"
               @click="showTips"

src/views/report/reportDetailPdf.vue

@@ -115,7 +115,7 @@ export default {
   },
   methods: {
     async getreportdetail() {
-      const { Data,Ret  } = await reportDetail({ ReportCode: this.id });
+      const { Data,Ret  } = await reportDetail({ ReportCode: this.id,IsReplace:1 });
         if (Ret !== 200) return
         this.reportInfo = Data.Report;
         this.configInfo = {
@@ -343,6 +343,15 @@ export default {
       }
   }
 }
+// 适配移动端页面
+@media screen and (max-width: 610px){
+  #reportdtl{
+    max-width: 600px;
+    header{
+      flex-direction: column-reverse;
+    }
+  }
+}
 // 不禁止页面打印,不然转pdf会出现空白页
 @media print{
     body{

src/views/reportEn/detail.vue

@@ -33,7 +33,7 @@
       <div id="abstract">
         <div class="abstract_cont">
           <div v-if="reportInfo.Abstract">Abstract：{{ reportInfo.Abstract }}</div>
-          <div style="color: #666; margintop: 1.2rem">
+          <div style="color: #666; margintop: 1.2rem" v-if="configInfo.DisclaimerEn">
             *Note: Please be sure to read the <strong
               style="fontweight: normal; cursor: pointer; color: #3e8ce6"
               @click="showTips"
@@ -248,7 +248,8 @@ export default {
     
         localStorage.setItem('waterMarkStr',this.$route.query.flag||'')
         const temwaterMarkStr=this.$route.query.flag||localStorage.getItem('waterMarkStr')
-        const waterMarkStr=Base64.decode(temwaterMarkStr)
+        let waterMarkStr=Base64.decode(temwaterMarkStr)
+        waterMarkStr=decodeURIComponent(waterMarkStr)
         this.$nextTick(()=>{
           if(Data.WatermarkReport==='true'){
             this.setWaterMark(waterMarkStr)

src/views/reportEn/detailPdf.vue

@@ -136,15 +136,15 @@ export default {
         this.reportInfo.Content=this.setReportContent(this.reportInfo.Content)
         this.isshow = true;
 
-        localStorage.setItem('waterMarkStr',this.$route.query.flag||'')
-        const temwaterMarkStr=this.$route.query.flag||localStorage.getItem('waterMarkStr')
-        const waterMarkStr=decodeURIComponent(Base64.decode(temwaterMarkStr))
-        this.$nextTick(()=>{
-          if(Data.WatermarkReport==='true'){
-            this.setWaterMark(waterMarkStr)
-          }
-          this.setBlindWaterMark(waterMarkStr)
-        })
+        // localStorage.setItem('waterMarkStr',this.$route.query.flag||'')
+        // const temwaterMarkStr=this.$route.query.flag||localStorage.getItem('waterMarkStr')
+        // const waterMarkStr=decodeURIComponent(Base64.decode(temwaterMarkStr))
+        // this.$nextTick(()=>{
+        //   if(Data.WatermarkReport==='true'){
+        //     this.setWaterMark(waterMarkStr)
+        //   }
+        //   this.setBlindWaterMark(waterMarkStr)
+        // })
     },
     setReportContent(str){
       let ps = str.split('</iframe>')
@@ -313,6 +313,15 @@ export default {
       border-top: 1px solid #ccc;
   }
 }
+// 适配移动端页面
+@media screen and (max-width: 610px){
+  #reportdtl{
+    max-width: 100%;
+    header{
+      flex-direction: column-reverse;
+    }
+  }
+}
 </style>
 
 <!-- 不禁止页面打印,不然转pdf会出现空白页 -->

src/views/smartReport/detail.vue

@@ -65,7 +65,7 @@
 
         <div class="abstract" v-if="reportInfo && !!reportInfo.NeedSplice">
           <div v-if="reportInfo.Abstract">摘要：{{ reportInfo.Abstract }}</div>
-          <div style="color: #666; margintop: 1.2rem">
+          <div style="color: #666; margintop: 1.2rem" v-if="configInfo.Disclaimer">
             *注：请务必阅读&nbsp;<strong
               style="fontweight: normal; cursor: pointer; color: #3e8ce6"
               @click="showTips"
@@ -135,6 +135,8 @@ import { getShareInfo,reportDetail } from "@/api/api.js";
 import _ from "lodash";
 import {wxShare,injectSdk} from "../utils/wxShare.js";
 import AudioPlay from '../report/audioPlay.vue';
+import { Watermark,BlindWatermark } from 'watermark-js-plus'
+import { Base64 } from 'js-base64';
 export default {
   components: { AudioPlay },
   data() {
@@ -189,14 +191,32 @@ export default {
       wxShare(document.location.href,res.Data.H5ShareName||document.title,res.Data.H5ShareTitle,res.Data.H5ReportShareImg,0);
       this.getreportdetail()
     },
-    pageResize(){
-      const el=document.getElementById('reportdtl')
-      const windowWid=document.body.clientWidth
-      if(windowWid<1200){
-        el.style.transform=`scale(${windowWid/1200})`
-        // el.style.
-      }
-    },
+    // pageResize(){
+    //   const el=document.getElementById('reportdtl')
+    //   const windowWid=document.body.clientWidth
+    //   if(windowWid<1200){
+    //     el.style.transform=`scale(${windowWid/1200})`
+    //     // el.style.
+    //   }
+    // },
+    // 智能布局移动端样式时内容排版全部变成1个1行的顺排
+    formatSmartStyle() {
+        this.$nextTick(() =>{
+            const width=window.innerWidth;
+            if(width>600) return
+            $('.report-drag-item-wrap_child-wrap').css({
+                'flex-wrap': 'wrap',
+            });
+            $('.report-drag-item-wrap_child-wrap').children().css({
+                'flex': 'none',
+                'width': '100%'
+            });
+            
+            document.querySelectorAll('div[comp-type="text"]').forEach(function(div) {
+              div.style.height = 'auto';
+            });
+        })
+    }, 
 
     playaudio(item) {
       //子组件先存后播
@@ -251,15 +271,24 @@ export default {
 
       this.headImgStyle=this.reportInfo.HeadStyle?JSON.parse(this.reportInfo.HeadStyle):[]
       this.endImgStyle=this.reportInfo.EndStyle?JSON.parse(this.reportInfo.EndStyle):[]
+      if(this.isMobileDevice()) {
+        this.headImgStyle.map(st =>{
+          st.size = st.sizeMobile || st.size;
+        })
+        this.endImgStyle.map(st =>{
+          st.size = st.sizeMobile || st.size;
+        })
+      }
       this.layoutBaseInfo['研报标题']=this.reportInfo.Title
       this.layoutBaseInfo['研报作者']=this.reportInfo.Author
       // 已发布已通过的报告才显示发布时间
       this.layoutBaseInfo['创建时间']=[2,6].includes(this.reportInfo.State)?this.reportInfo.PublishTime:''
       
       this.isshow = true;
-      this.$nextTick(()=>{
-        this.pageResize()
-      })
+      this.formatSmartStyle()
+      // this.$nextTick(()=>{
+      //   this.pageResize()
+      // })
 
       // wxShare(document.location.href, H5ShareName || document.title, wxShareTitle, H5ReportShareImg, 0);
 
@@ -277,6 +306,71 @@ export default {
           wx.previewImage({ current: curImageSrc, urls: imgArray });
         }
       });
+
+      //水印
+      localStorage.setItem('waterMarkStr',this.$route.query.flag||'')
+      const temwaterMarkStr=this.$route.query.flag||localStorage.getItem('waterMarkStr')
+      let waterMarkStr=Base64.decode(temwaterMarkStr)
+      waterMarkStr=decodeURIComponent(waterMarkStr)
+      this.$nextTick(()=>{
+        if(Data.WatermarkReport==='true'){
+          this.setWaterMark(waterMarkStr)
+        }
+        this.setBlindWaterMark(waterMarkStr)
+      })
+    },
+
+    setWaterMark(str){
+      const text=str||''
+      const target=document.getElementById('resetcss')
+      const canvas = document.createElement("canvas");
+
+      const ctx = canvas.getContext("2d");
+      ctx.font = "18px Arial";
+      ctx.rotate((-45 * Math.PI) / 200);
+      ctx.fillStyle='#f1f1f1'
+      ctx.fillText(text, 30, 200);
+      ctx.fillText(text, -40, 100);
+
+      // 将canvas的内容转换为base64编码
+      const data = canvas.toDataURL("image/png");
+      target.style.background = "url(" + data + ") repeat";
+    },
+
+    // 设置水印
+    setBlindWaterMark(str){
+      
+      const blindwatermark = new BlindWatermark({
+        content: str||'',
+        width: 200,
+        height: 200,
+        onSuccess: () => {
+          // success callback
+        }
+      })
+      blindwatermark.create()
+    },
+
+
+    /**
+     * 判断是否为移动设备
+     *
+     * @returns 返回布尔值，表示是否为移动设备
+    */
+    isMobileDevice() {
+      const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+      // Windows Phone must come first because its UA also contains "Android"
+      if (/windows phone/i.test(userAgent)) {
+        return true;
+      }
+      if (/android/i.test(userAgent)) {
+        return true;
+      }
+      // iOS detection
+      if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+        return true;
+      }
+      return false;
     },
 
     /*内容分割*/
@@ -355,8 +449,8 @@ body{
   font-size: 14px;
   background: #fff;
   overflow: auto;
-  width: 1200px;
-  padding: 20px 20px 20px 44px;
+  width: 1240px;
+  padding: 20px;
   margin: 0 auto;
 
   .top-header {
@@ -472,10 +566,14 @@ body{
 		}
   }
 }
-@media screen and (max-width:1200px){
+@media screen and (max-width:610px){
   #reportdtl{
-    position: absolute;
-    transform-origin: 0 0;
+    width: 100%;
+    .no-layout-img-box{
+      header{
+        flex-direction: column-reverse;
+      }
+    }
   }
 }
 </style>

src/views/smartReport/detailPdf.vue

@@ -84,11 +84,11 @@ export default {
   },
   mounted() {
     this.getreportdetail();
-    window.addEventListener('resize',this.pageResize)
+    // window.addEventListener('resize',this.pageResize)
   },
 
   destroyed() {
-    window.removeEventListener('resize',this.pageResize)
+    // window.removeEventListener('resize',this.pageResize)
   },
   methods: {
     pageResize(){
@@ -99,8 +99,26 @@ export default {
         // el.style.
       }
     },
+    // 智能布局移动端样式时内容排版全部变成1个1行的顺排
+    formatSmartStyle() {
+        this.$nextTick(() =>{
+            const width=window.innerWidth;
+            if(width>600) return
+            $('.report-drag-item-wrap_child-wrap').css({
+                'flex-wrap': 'wrap',
+            });
+            $('.report-drag-item-wrap_child-wrap').children().css({
+                'flex': 'none',
+                'width': '100%'
+            });
+            
+            document.querySelectorAll('div[comp-type="text"]').forEach(function(div) {
+              div.style.height = 'auto';
+            });
+        })
+    },   
     async getreportdetail() {
-      const { Data, Ret } = await reportDetail({ ReportCode: this.id });
+      const { Data, Ret } = await reportDetail({ ReportCode: this.id,IsReplace:1 });
       if (Ret !== 200) return;
       
       this.reportInfo = Data.Report;
@@ -111,16 +129,47 @@ export default {
 
       this.headImgStyle=this.reportInfo.HeadStyle?JSON.parse(this.reportInfo.HeadStyle):[]
       this.endImgStyle=this.reportInfo.EndStyle?JSON.parse(this.reportInfo.EndStyle):[]
+      if(this.isMobileDevice()) {
+        this.headImgStyle.map(st =>{
+          st.size = st.sizeMobile || st.size;
+        })
+        this.endImgStyle.map(st =>{
+          st.size = st.sizeMobile || st.size;
+        })
+      }
       this.layoutBaseInfo['研报标题']=this.reportInfo.Title
       this.layoutBaseInfo['研报作者']=this.reportInfo.Author
       // 已发布已通过的报告才显示发布时间
       this.layoutBaseInfo['创建时间']=(this.reportInfo.PublishTime||this.reportInfo.PrePublishTime)
       this.reportInfo.Content=this.setReportContent(this.reportInfo.Content)
       this.isshow = true;
-      this.$nextTick(()=>{
-        this.pageResize()
-      })
+      this.formatSmartStyle()
+      // this.$nextTick(()=>{
+      //   this.pageResize()
+      // })
+    },
+
+    /**
+     * 判断是否为移动设备
+     *
+     * @returns 返回布尔值，表示是否为移动设备
+    */
+    isMobileDevice() {
+      const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+      // Windows Phone must come first because its UA also contains "Android"
+      if (/windows phone/i.test(userAgent)) {
+        return true;
+      }
+      if (/android/i.test(userAgent)) {
+        return true;
+      }
+      // iOS detection
+      if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+        return true;
+      }
+      return false;
     },
+
     setReportContent(str){
       let ps = str.split('</iframe>')
       let returnStr=''
@@ -175,7 +224,7 @@ body{
   font-size: 14px;
   background: #fff;
   overflow: auto;
-  width: 1200px;
+  max-width: 1240px;
   padding: 20px;
   margin: 0 auto;
 
@@ -268,10 +317,14 @@ body{
       }
   }
 }
-@media screen and (max-width:1200px){
+@media screen and (max-width:610px){
   #reportdtl{
-    position: absolute;
-    transform-origin: 0 0;
+    max-width: 100%;
+    .no-layout-img-box{
+      header{
+        flex-direction: column-reverse;
+      }
+    }
   }
 }