【银保app】添加水印公共js并调用获取代理人信息接口

src/assets/js/utils/warterMark.js

@@ -0,0 +1,54 @@
+// warterMark.js
+'use strict'
+
+let watermark = {}
+
+let setWatermark = (str, str1) => {
+  let id = '1.23452384164.123412415'
+
+  if (document.getElementById(id) !== null) {
+    document.body.removeChild(document.getElementById(id))
+  }
+
+  let can = document.createElement('canvas')// 创建一个画布
+  can.width = 350 // 设置宽度
+  can.height = 150 // 高度
+
+  let cans = can.getContext('2d')
+  cans.rotate(-25 * Math.PI / 180) // 水印旋转角度    0 水平
+  cans.font = '14px Vedana'  // 字体大小
+  cans.fillStyle = '#000' // 水印的颜色
+  cans.textAlign = 'left' // 设置文本内容的当前对齐方式
+  cans.textBaseline = 'Middle' // 设置在绘制文本时使用的当前文本基线
+  cans.globalAlpha = 0.1 // 透明度
+  cans.fillText(str, can.width / 4.5, can.height / 1) // 在画布上绘制填色的文本（输出的文本，开始绘制文本的X坐标位置，开始绘制文本的Y坐标位置）
+  cans.fillText(str1, can.width / 3, can.height / 2.5) // 根据需求可添加多行水印，在方法中添加str1
+
+  let div = document.createElement('div')
+  div.id = id
+  div.style.pointerEvents = 'none'
+  div.style.top = '100px'
+  div.style.left = '0px'
+  div.style.position = 'fixed'
+  div.style.zIndex = '100000'
+  div.style.width = document.documentElement.clientWidth - 30 + 'px'
+  div.style.height = document.documentElement.clientHeight + 'px'
+  div.style.background = 'url(' + can.toDataURL('image/png') + ') left top repeat'
+  document.body.appendChild(div)
+  return id
+}
+
+// 该方法只允许调用一次
+watermark.set = (str,str1) => {
+  let id = setWatermark(str,str1)
+  setInterval(() => {
+    if (document.getElementById(id) === null) {
+      id = setWatermark(str,str1)
+    }
+  }, 500)
+  window.onresize = () => {
+    setWatermark(str,str1)
+  }
+}
+
+export default watermark

src/views/YB_APP/policyDetail.vue

@@ -21,6 +21,8 @@
 
 <script>
 import { YBpolicyDetail } from '@/api/YB_APP/index'
+import warterMark from "@/assets/js/utils/warterMark.js"
+import { getAgentInfo } from '@/api/ebiz/my/my.js'
 export default {
   name: 'policyDetail',
   components: {},
@@ -31,11 +33,20 @@ export default {
     }
   },
   mounted() {
+    this.getAgentInfo()
     this.policyNo = this.$route.query.policyNo
     console.log(this.policyNo, 'avc')
     this.YBpolicyDetail()
   },
   methods: {
+    getAgentInfo(){
+      getAgentInfo({}).then(res=>{
+        if(res.result == 0){
+          console.log('123')
+          warterMark.set(res.name+res.jobNo,"")
+        }
+      })
+    },
     YBpolicyDetail() {
       let params = {
         policyNo: this.policyNo

src/views/YB_APP/policyList.vue

@@ -5,6 +5,7 @@
       <van-search shape="round" v-model="findValue" placeholder="请输入保单号" />
       <button class="searchButton" @click="keywordSearch(findValue)">搜索</button>
     </div>
+    <!-- <div style="width:100%;height:1000px;background:rgba(0, 0, 0, 0.2);"></div> -->
       
       <!-- 右侧搜索按钮 -->
      
@@ -120,6 +121,8 @@ import { Button, Search } from 'vant'
 import { ref } from 'vue'
 import utils from '@/assets/js/utils/date-utils'
 import { YBpolicyListAgent } from '@/api/YB_APP/index'
+import warterMark from "@/assets/js/utils/warterMark.js"
+import { getAgentInfo } from '@/api/ebiz/my/my.js'
 
 export default {
   name: 'policyList',
@@ -182,6 +185,8 @@ export default {
     }, 500)
   },
   mounted() {
+    this.getAgentInfo()
+    
     this.YBpolicyListAgent()
     // 筛选按钮的点击事件
     window.appCallBack = this.appCallBack
@@ -190,6 +195,14 @@ export default {
   },
 
   methods: {
+    getAgentInfo(){
+      getAgentInfo({}).then(res=>{
+        if(res.result == 0){
+          console.log('123')
+          warterMark.set(res.name+res.jobNo,"")
+        }
+      })
+    },
     appCallBack(data, flag) {
       // 筛选按钮的点击事件
       this.showSideBar = true