1 |
- "use strict";var _baseComponent=_interopRequireDefault(require("../helpers/baseComponent")),_classNames2=_interopRequireDefault(require("../helpers/libs/classNames")),_styleToCssString=_interopRequireDefault(require("../helpers/libs/styleToCssString")),_useNativeAPI=require("../helpers/hooks/useNativeAPI"),_useCanvasAPI=require("../helpers/hooks/useCanvasAPI");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _typeof(e){return(_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function _defineProperty(e,t,r){return(t=_toPropertyKey(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function _toPropertyKey(e){e=_toPrimitive(e,"string");return"symbol"==_typeof(e)?e:String(e)}function _toPrimitive(e,t){if("object"!=_typeof(e)||!e)return e;var r=e[Symbol.toPrimitive];if(void 0===r)return("string"===t?String:Number)(e);r=r.call(e,t||"default");if("object"!=_typeof(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}(0,_baseComponent.default)({properties:{prefixCls:{type:String,value:"wux-water-mark"},content:{optionalTypes:[Array,String],type:String,value:""},fontColor:{type:String,value:"rgba(0, 0, 0, .15)"},fontStyle:{type:String,value:"normal"},fontFamily:{type:String,value:"sans-serif"},fontWeight:{type:String,value:"normal"},fontSize:{type:Number,value:14},fullPage:{type:Boolean,value:!0},gapX:{type:Number,value:24},gapY:{type:Number,value:48},width:{type:Number,value:120},height:{type:Number,value:64},image:{type:String,value:""},imageHeight:{type:Number,value:64},imageWidth:{type:Number,value:128},rotate:{type:Number,value:-22},zIndex:{type:Number,value:2e3}},data:{wrapStyle:"",base64Url:""},observers:_defineProperty(_defineProperty({},"zIndex, gapX, width, base64Url",function(){this.updateStyle.apply(this,arguments)}),"prefixCls, gapX, gapY, rotate, fontStyle, fontWeight, width, height, fontFamily, fontColor, image, imageWidth, imageHeight, content, fontSize",function(){this.setBase64Url.apply(this,arguments)}),computed:{classes:["prefixCls, fullPage",function(e,t){return{wrap:(0,_classNames2.default)(e,_defineProperty({},"".concat(e,"--full-page"),t)),canvas:"".concat(e,"__canvas")}}]},methods:{setBase64Url:function(){for(var e=arguments.length,t=new Array(e),r=0;r<e;r++)t[r]=arguments[r];var a=t[0],n=t[1],i=t[2],o=t[3],u=t[4],l=t[5],s=t[6],f=t[7],p=t[8],g=t[9],c=t[10],y=t[11],h=t[12],m=t[13],v=t[14];this.createCanvasContext({prefixCls:a,gapX:n,gapY:i,rotate:o,fontStyle:u,fontWeight:l,width:s,height:f,fontFamily:p,fontColor:g,image:c,imageWidth:y,imageHeight:h,content:m,fontSize:v})},createCanvasContext:function(t){var r=this,e=t.prefixCls,l=t.gapX,s=t.gapY,f=t.rotate,p=t.fontStyle,g=t.fontWeight,c=t.width,y=t.height,h=t.fontFamily,m=t.fontColor,a=t.image,v=t.imageWidth,d=t.imageHeight,b=t.content,_=t.fontSize,n="".concat(e,"__canvas"),e=Promise.resolve();return e=(e=(e=a?e.then(function(){return(0,_useCanvasAPI.downloadImage)(a)}):e).then(function(e){return u=e,(0,_useCanvasAPI.getCanvasRef)(n,r).then(function(e){var r,a=e.getContext("2d"),t=(0,_useNativeAPI.getSystemInfoSync)(["window"]).pixelRatio,n=(s+y)*t,i=c*t,o=y*t;return e.width=(l+c)*t,e.height=n,u?(a.translate(i/2,o/2),a.rotate(Math.PI/180*Number(f)),(0,_useCanvasAPI.createImage)({imageWidth:v,imageHeight:d,imageUrl:u},e).then(function(){return(0,_useCanvasAPI.toDataURL)({width:c,height:y},e).then(function(e){return a.restore(),e})})):b?(a.textBaseline="middle",a.textAlign="center",a.translate(i/2,o/2),a.rotate(Math.PI/180*Number(f)),r=Number(_)*t,a.font="".concat(p," normal ").concat(g," ").concat(r,"px/").concat(o,"px ").concat(h),a.fillStyle=m,Array.isArray(b)?b.forEach(function(e,t){return a.fillText(e,0,t*r)}):a.fillText(b,0,0),(0,_useCanvasAPI.toDataURL)({width:c,height:y},e).then(function(e){return a.restore(),e})):void 0});var u})).then(function(e){e=e,t.base64Url!==e&&(r.setData({base64Url:e}),r.triggerEvent("load",{base64Url:e}))},function(e){r.triggerEvent("error",e)})},updateStyle:function(e,t,r,a){e=(0,_styleToCssString.default)({zIndex:e,backgroundSize:"".concat(t+r,"px"),backgroundImage:a?"url('".concat(a,"')"):"unset"});this.setData({wrapStyle:e})}},ready:function(){var e=this.data,t=e.zIndex,r=e.gapX,a=e.width,e=e.base64Url;this.updateStyle(t,r,a,e),this.createCanvasContext(this.data)}});
|