2 lines
3.0 KiB
JavaScript
2 lines
3.0 KiB
JavaScript
import{J as $}from"./element-a4dc66a7.js";import{r as L,s as B,c as I,z as V,H as D,ah as z,l as H,m as M,p as T,V as c,P as u,u as y,T as k}from"./vue-2207505e.js";import{_ as G}from"./index-ac67ab38.js";import"./vxe-51e6f8a7.js";const W={color:"#c0c4cc",opacity:.5,size:"16px",family:"serif",angle:-20,width:200,height:150},P=L(document.body);function g(l=P){let v;const t=B(null),C=e=>{const{color:a,opacity:s,size:r,family:m,angle:h,width:b,height:x}=v??W,p=document.createElement("canvas");p.width=b,p.height=x;const n=p.getContext("2d");return n&&(n.fillStyle=a,n.globalAlpha=s,n.font=r+" "+m,n.rotate(Math.PI/180*h),n.clearRect(0,0,b,x),n.fillText(e,0,x/2)),p.toDataURL()},f=()=>{!l.value||!t.value||(l.value.removeChild(t.value),t.value=null,_(l.value))},d=(e={})=>{t.value&&(e.width&&(t.value.style.width=`${e.width}px`),e.height&&(t.value.style.height=`${e.height}px`),e.text&&(t.value.style.background=`url(${C(e.text)}) left top repeat`))},O=e=>{if(!l.value)return;if(t.value){d({text:e});return}const a=document.createElement("div");t.value=a,a.style.pointerEvents="none",a.style.top="0",a.style.left="0",a.style.position="absolute",a.style.zIndex="9999";const{clientWidth:s,clientHeight:r}=l.value;d({width:s,height:r,text:e}),l.value.appendChild(a)},o=(e,a={})=>{l.value&&(l.value.style.position="relative",v={...W,...a},O(e),i(l.value),I()&&V(f))},i=e=>{e._mutationObserver||e._resizeObserver||!t.value||(w(e),R(e))},_=e=>{var a,s;(a=e._mutationObserver)==null||a.disconnect(),e._mutationObserver=void 0,(s=e._resizeObserver)==null||s.unobserve(e),e._resizeObserver=void 0},w=e=>{const a={attributes:!0,childList:!0,subtree:!0},s=m=>{m.forEach(h=>{switch(h.type){case"childList":h.removedNodes.forEach(b=>{b===t.value&&e.appendChild(t.value)});break;case"attributes":t.value.style.display==="none"?t.value.style.display="block":t.value.style.visibility==="hidden"&&(t.value.style.visibility="visible");break}})},r=new MutationObserver(s);r.observe(e,a),e._mutationObserver=r},R=e=>{const a=$(()=>{const{clientWidth:r,clientHeight:m}=e;d({width:r,height:m})},500),s=new ResizeObserver(a);s.observe(e),e._resizeObserver=s};return{setWatermark:o,clear:f}}const U={class:"app-container"},A=D({__name:"use-watermark",setup(l){const v=L(null),{setWatermark:t,clear:C}=g(v),{setWatermark:f,clear:d}=g();return(O,o)=>{const i=z("el-button"),_=z("el-button-group");return H(),M("div",U,[T("div",{ref_key:"localRef",ref:v,class:"local"},null,512),c(_,null,{default:u(()=>[c(i,{type:"primary",onClick:o[0]||(o[0]=w=>y(t)("局部水印",{color:"#409eff"}))},{default:u(()=>[k("创建局部水印")]),_:1}),c(i,{type:"primary",onClick:y(C)},{default:u(()=>[k("清除局部水印")]),_:1},8,["onClick"])]),_:1}),c(_,null,{default:u(()=>[c(i,{type:"primary",onClick:o[1]||(o[1]=w=>y(f)("全局水印"))},{default:u(()=>[k("创建全局水印")]),_:1}),c(i,{type:"primary",onClick:y(d)},{default:u(()=>[k("清除全局水印")]),_:1},8,["onClick"])]),_:1})])}}});const q=G(A,[["__scopeId","data-v-3a15d249"]]);export{q as default};
|