iking-image-valid/dist/ikingimagevalid.umd.js

金合前端组件 - 1.0.5添加props可自定义验证码颜色

(function(s,o){typeof exports=="object"&&typeof module<"u"?o(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],o):(s=typeof globalThis<"u"?globalThis:s||self,o(s.ikingImageValid={},s.Vue))})(this,function(s,o){"use strict";const C=o.defineComponent({__name:"iking-image-valid",props:{option:{type:Object}},emits:["change"],setup(m,{expose:v,emit:F}){const _=m,w=[0,1,2,3,4,5,6,7,8,9],M=["A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z"],x=M.map(t=>t.toLowerCase()),h=[...M,...x],A={width:100,height:36,size:20,line:!0,lineNum:4,num:4,type:"number",useCase:!1,background:"#eee",rote:!0,point:!0,pointNum:80,codeColor:["#393939","#101655","#0B476F","#06CA3F","#560D69"]},p=o.computed(()=>({...A,..._.option})),c=o.ref(null),n=t=>Math.floor(Math.random()*t),k=()=>`rgba(${n(256)}, ${n(256)}, ${n(256)}, ${8})`,E=()=>{let t="";const{type:l,num:i}=p.value;if(l==="number")for(let u=0;u<i;u++)t+=(Math.random()*9).toFixed(0);else if(l==="letter"){const u=h.length;for(let a=0;a<i;a++)t+=h[Math.floor(Math.random()*(u-1))]}else{const u=[...h,...w],a=u.length;for(let d=0;d<i;d++)t+=u[Math.floor(Math.random()*(a-1))]}return F("change",t),t},g=()=>{if(!c.value)throw new Error("\u9A8C\u8BC1\u7801\u6E32\u67D3\u8282\u70B9\u672A\u627E\u5230\uFF01");const t=E(),{width:l,height:i,background:u,size:a,line:d,lineNum:N,point:P,pointNum:S,num:b}=p.value;if(!l||!b||!i)return;const T=Math.floor(l/b);c.value.setAttribute("width",l+""),c.value.setAttribute("height",i+"");const e=c.value.getContext("2d");if(!e)return;e.fillStyle=u,e.fillRect(0,0,l,i),e.textBaseline="middle";const f=p.value.codeColor||[];for(let r=0;r<t.length;r++)e.fillStyle=f[Math.floor((f==null?void 0:f.length)-1)],e.font=`bold ${a}px \u5FAE\u8F6F\u96C5\u9ED1`,e.fillText(t.charAt(r),T*(r||n(1)),i/2+n(10));if(d)for(let r=0;r<N;r++)e.strokeStyle=k(),e.moveTo(n(l),n(i)),e.lineTo(n(l),n(i)),e.lineWidth=1,e.stroke();if(P)for(let r=0;r<S;r++)e.fillStyle=k(),e.beginPath(),e.arc(n(l),n(i),1,0,2*Math.PI),e.fill()};o.onMounted(()=>{g()}),v({drawCode:g});const B=()=>{g()};return(t,l)=>(o.openBlock(),o.createElementBlock("div",null,[o.createElementVNode("canvas",{class:"codeCanvas",ref_key:"checkCode",ref:c,onClick:B},null,512)]))}}),y={install:m=>{m.component("ikingImageValid",C)}};s.default=C,s.installed=y,Object.defineProperties(s,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});