vuux
Version:
Vue3 Nuxt3 Nuxt4 组件库
2 lines (1 loc) • 1.97 kB
JavaScript
;Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("vue"),X=(l,t,u,s,o)=>{const c={text:"请按住滑块拖动",successText:"验证通过"},d=a.ref(!1),i=a.ref(!1),n=a.ref(!1),f=a.ref(0),r=a.ref(0),g=a.ref(0),y=a.ref(90),M=a.ref(270),h=a.computed({get:()=>l.modelValue?l.successText||c.successText:l.text||c.text,set:e=>e}),x=()=>{const e=Math.floor(y.value+Math.random()*(M.value-y.value));r.value=e,t.value&&(t.value.style.transform=`rotateZ(${e}deg)`,t.value.style.transition="0.5s")},V=()=>{o("update:modelValue",!1),d.value=!1,i.value=!1,n.value=!1,u.value&&(u.value.style.left="0"),s.value&&(s.value.style.width="0")},O=e=>{e.cancelable&&e.preventDefault(),l.modelValue||(n.value=!0,e instanceof MouseEvent?f.value=e.pageX:e instanceof TouchEvent&&(f.value=e.touches[0].pageX))},b=()=>y.value===M.value?Math.floor(1+Math.random()*6)/10+1:1,m=e=>{if(e.cancelable&&e.preventDefault(),n.value&&!l.modelValue){let v=0;e instanceof MouseEvent?v=e.pageX-f.value:e instanceof TouchEvent&&(v=e.touches[0].pageX-f.value),u.value&&(u.value.style.left=v+"px"),s.value&&(s.value.style.width=v+40/2+"px");const T=Math.ceil(v/200*M.value*b());g.value=T,t.value&&(t.value.style.transform=`rotateZ(${r.value-T}deg)`,t.value.style.transition="0s")}},D=()=>{d.value=!0,n.value=!1,o("result",!0),o("update:modelValue",!0)};return{rotateIsOk:d,rotateIsLoosen:i,rotateIsMoving:n,rotateMessage:h,rotateOnLoad:x,rotateOnMousedown:O,rotateOnMousemove:m,rotateOnMouseup:async()=>{!t.value||!s.value||!u.value||(n.value&&!l.modelValue&&(Math.abs(r.value-g.value)>(l.difference||10)?(i.value=!0,t.value.style.transform=`rotateZ(${r.value}deg)`,t.value.style.transition="0.5s",setTimeout(()=>{u.value&&(u.value.style.left="0"),s.value&&(s.value.style.width="0"),i.value=!1},500),setTimeout(()=>{V(),x()},650),o("result",!1),o("update:modelValue",!1)):D()),n.value=!1)},rotateReset:()=>{V(),x(),h.value=l.text??c.text}}};exports.useVerifyRotate=X;