diff --git a/src/main.js b/src/main.js
index 137c0ca..ee5b03a 100644
--- a/src/main.js
+++ b/src/main.js
@@ -22,7 +22,7 @@ import Directive from './directives'
// 自定义过滤器
import Filter from './filters'
// 自定义水印指令
-import '@/utils/warterMark'
+import '@/utils/waterMark'
// 加密函数
import JSEncrypt from '../src/assets/js/jsencrypt.min.js';
diff --git a/src/utils/warterMark.js b/src/utils/waterMark.js
similarity index 61%
rename from src/utils/warterMark.js
rename to src/utils/waterMark.js
index 5256005..a80a55c 100644
--- a/src/utils/warterMark.js
+++ b/src/utils/waterMark.js
@@ -9,7 +9,7 @@ import Vue from 'vue'
Vue.directive('watermark', {
bind: function(el, binding){
// 水印文字,父元素,画布宽度,画布高度,字体,文字颜色,画布横坐标,是否铺满全页
- function addWaterMarker(str, parentNode, width, height, font, textColor, fillTextX = '10', isFull = false){
+ function addWaterMarker(str, parentNode, width, height, font, textColor, fillTextX = '10'){
// 检查父元素是否包含子元素
const elementContains = (parent, child) => parent !== child && parent.contains(child)
const flag = elementContains(parentNode, document.querySelector('canvas'))
@@ -17,37 +17,36 @@ Vue.directive('watermark', {
if (!flag) {
let can = document.createElement('canvas')
parentNode.appendChild(can)
- can.width = width || 200
+ can.width = width || 300
can.height = height || 140
can.style.display = 'none'
let cans = can.getContext('2d')
cans.rotate(-20 * Math.PI / 180)
cans.font = font || '13px Microsoft Yahei'
- cans.fillStyle = textColor || '#DDDDDD'
+ cans.fillStyle = textColor || 'rgba(100, 100, 100, 0.2)'
cans.textAlign = 'left'
cans.textBaseline = 'Middle'
cans.fillText(str, fillTextX, can.height)
// 设置背景图(整个项目中都添加水印建议使用此方法)
- if(isFull) {
- parentNode.style.backgroundImage = "url(" + can.toDataURL("image/png") + ")";
- } else {
- // 创建div 定位覆盖(某个元素,如图片添加水印建议使用此方法)
- let div = document.createElement('div')
- div.id = str
- div.style.pointerEvents = 'none'
- div.style.top = '0'
- div.style.left = '0'
- div.style.position = 'absolute'
- div.style.zIndex = '100000'
- div.style.width = '100%'
- div.style.height = '100%'
- div.style.background = 'url(' + can.toDataURL('image/png') + ')'
- parentNode.appendChild(div)
- }
+ // parentNode.style.backgroundImage = "url(" + can.toDataURL("image/png") + ")";
+
+ // 创建div 定位覆盖(某个元素,如图片添加水印建议使用此方法)
+ let div = document.createElement('div')
+ div.id = str
+ div.className = 'waterMark'
+ div.style.pointerEvents = 'none'
+ div.style.top = '0'
+ div.style.left = '0'
+ div.style.position = 'absolute'
+ div.style.zIndex = '100000'
+ div.style.width = '100%'
+ div.style.height = '100%'
+ div.style.background = 'url(' + can.toDataURL('image/png') + ')'
+ parentNode.appendChild(div)
}
}
if (binding.value.text) {
- addWaterMarker(binding.value.text, el, binding.value.width, binding.value.height, binding.value.font, binding.value.textColor, binding.value.fillTextX, binding.value.isFull )
+ addWaterMarker(binding.value.text, el, binding.value.width, binding.value.height, binding.value.font, binding.value.textColor, binding.value.fillTextX)
}
}
})
diff --git a/src/views/Report/ReportDetail.vue b/src/views/Report/ReportDetail.vue
index 79051a7..4239762 100644
--- a/src/views/Report/ReportDetail.vue
+++ b/src/views/Report/ReportDetail.vue
@@ -25,18 +25,22 @@
报告详情