UNPKG

ideaz-element

Version:

<p align="center"> <a href="" target="_blank" rel="noopener noreferrer"> <img src="./docs/public/logo.svg" alt="Ideaz Element" width="180" style="width: 180px;" /> </a> </p>

3 lines (2 loc) 2.23 kB
"use strict";const c=require("vue");require("../../../utils/index.cjs");const H=require("./watermark.cjs"),M=require("../../../hooks/useNamespace.cjs"),U=require("../../../hooks/useLocale.cjs"),t=require("../../../utils/string.cjs"),Y=e=>{if(!e)return 1;const s=e.backingStorePixelRatio||e.webkitBackingStorePixelRatio||e.mozBackingStorePixelRatio||e.msBackingStorePixelRatio||e.oBackingStorePixelRatio||e.backingStorePixelRatio||1;return(window.devicePixelRatio||1)/s},D=c.defineComponent({name:"ZWatermark",props:H.watermarkProps,setup(e,{slots:s}){const S=M.useNamespace("watermark"),{t:R}=U.useLocale(),p=c.ref("");return c.onMounted(()=>{const{gapX:u=212,gapY:g=222,width:m=120,height:d=64,rotate:v=-22,image:l,content:r,offsetLeft:h,offsetTop:x,fontStyle:f="normal",fontWeight:y="normal",fontColor:N="rgba(0,0,0,.15)",fontSize:$=16,fontFamily:z="sans-serif"}=e,k=t.convertToPx(d),P=t.convertToPx(m),L=t.convertToPx($),W=t.convertToPx(v),b=t.convertToPx(g),w=t.convertToPx(u),q=t.convertToPx(h||0),I=t.convertToPx(x||0),i=document.createElement("canvas"),o=i.getContext("2d"),a=Y(o),X=`${(w+P)*a}px`,O=`${(b+k)*a}px`,A=q||w/2,B=I||b/2;if(i.setAttribute("width",X),i.setAttribute("height",O),o){o.translate(A*a,B*a),o.rotate(Math.PI/180*Number(W));const C=P*a,T=k*a;if(l){const n=new Image;n.crossOrigin="anonymous",n.referrerPolicy="no-referrer",n.src=l,n.onload=()=>{o.drawImage(n,0,0,C,T),p.value=i.toDataURL()}}else if(r){const n=Number(L)*a;o.font=`${f} normal ${y} ${n}px/${T}px ${z}`,o.fillStyle=N,Array.isArray(r)?r==null||r.forEach((E,G)=>{o.fillText(E,0,G*50)}):o.fillText(r,0,0),p.value=i.toDataURL()}}else console.error(R("watermark.tip"))}),()=>{var f;const{style:u,markStyle:g,zIndex:m=9,gapX:d=212,width:v=120,markClassName:l,className:r}=e,h=t.convertToPx(v),x=t.convertToPx(d);return c.createVNode("div",{style:{position:"relative",...u},class:[S.b("wrapper"),r]},[(f=s.default)==null?void 0:f.call(s),c.createVNode("div",{class:l,style:{zIndex:Number(m),position:"absolute",left:0,top:0,width:"100%",height:"100%",backgroundSize:`${x+h}px`,pointerEvents:"none",backgroundRepeat:"repeat",...p.value?{backgroundImage:`url('${p.value}')`}:{},...g}},null)])}}});module.exports=D; //# sourceMappingURL=index.cjs.map