mirror of
https://github.com/pure-admin/vue-pure-admin.git
synced 2025-06-08 01:17:23 +08:00
5 lines
4.4 KiB
JavaScript
5 lines
4.4 KiB
JavaScript
import{p as l}from"./propTypes-3b04af70.js";import{n as g,Y as p}from"./index-fa5d6b3f.js";const b={startVal:l.number.def(0),endVal:l.number.def(2020),duration:l.number.def(1300),autoplay:l.bool.def(!0),decimals:{type:Number,required:!1,default:0,validator(t){return t>=0}},color:l.string.def(),fontSize:l.string.def(),decimal:l.string.def("."),separator:l.string.def(","),prefix:l.string.def(""),suffix:l.string.def(""),useEasing:l.bool.def(!0),easingFn:{type:Function,default(t,u,e,n){return e*(-Math.pow(2,-10*t/n)+1)*1024/1023+u}}},y=Vue.defineComponent({name:"ReNormalCountTo",props:b,emits:["mounted","callback"],setup(t,{emit:u}){const e=Vue.reactive({localStartVal:t.startVal,displayValue:d(t.startVal),printVal:null,paused:!1,localDuration:t.duration,startTime:null,timestamp:null,remaining:null,rAF:null,color:null,fontSize:"16px"}),n=Vue.computed(()=>t.startVal>t.endVal);Vue.watch([()=>t.startVal,()=>t.endVal],()=>{t.autoplay&&i()});function i(){const{startVal:r,duration:s,color:c,fontSize:a}=t;e.localStartVal=r,e.startTime=null,e.localDuration=s,e.paused=!1,e.color=c,e.fontSize=a,e.rAF=requestAnimationFrame(V)}function V(r){const{useEasing:s,easingFn:c,endVal:a}=t;e.startTime||(e.startTime=r),e.timestamp=r;const o=r-e.startTime;e.remaining=e.localDuration-o,s?Vue.unref(n)?e.printVal=e.localStartVal-c(o,0,e.localStartVal-a,e.localDuration):e.printVal=c(o,e.localStartVal,a-e.localStartVal,e.localDuration):Vue.unref(n)?e.printVal=e.localStartVal-(e.localStartVal-a)*(o/e.localDuration):e.printVal=e.localStartVal+(a-e.localStartVal)*(o/e.localDuration),Vue.unref(n)?e.printVal=e.printVal<a?a:e.printVal:e.printVal=e.printVal>a?a:e.printVal,e.displayValue=d(e.printVal),o<e.localDuration?e.rAF=requestAnimationFrame(V):u("callback")}function d(r){const{decimals:s,decimal:c,separator:a,suffix:o,prefix:x}=t;r=Number(r).toFixed(s),r+="";const m=r.split(".");let f=m[0];const T=m.length>1?c+m[1]:"",N=/(\d+)(\d{3})/;if(a&&!g(a))for(;N.test(f);)f=f.replace(N,"$1"+a+"$2");return x+f+T+o}return Vue.onMounted(()=>{t.autoplay&&i(),u("mounted")}),()=>Vue.createVNode(Vue.Fragment,null,[Vue.createVNode("span",{style:{color:t.color,fontSize:t.fontSize}},[e.displayValue])])}});const S={delay:l.number.def(1),blur:l.number.def(2),i:{type:Number,required:!1,default:0,validator(t){return t<10&&t>=0&&Number.isInteger(t)}}},h=Vue.defineComponent({name:"ReboundCountTo",props:S,setup(t){const u=Vue.ref(),e=Vue.ref(null);return Vue.onBeforeMount(()=>{const n=navigator.userAgent.toLowerCase(),i=d=>d.test(n);i(/safari/g)&&!i(/chrome/g)&&(e.value=setTimeout(()=>{u.value.setAttribute("style",`
|
|
animation: none;
|
|
transform: translateY(calc(var(--i) * -9.09%))
|
|
`)},t.delay*1e3))}),Vue.onBeforeUnmount(()=>{clearTimeout(Vue.unref(e))}),()=>Vue.createVNode(Vue.Fragment,null,[Vue.createVNode("div",{class:"scroll-num",style:{"--i":t.i,"--delay":t.delay}},[Vue.createVNode("ul",{ref:"ulRef",style:{fontSize:"32px"}},[Vue.createVNode("li",null,[Vue.createTextVNode("0")]),Vue.createVNode("li",null,[Vue.createTextVNode("1")]),Vue.createVNode("li",null,[Vue.createTextVNode("2")]),Vue.createVNode("li",null,[Vue.createTextVNode("3")]),Vue.createVNode("li",null,[Vue.createTextVNode("4")]),Vue.createVNode("li",null,[Vue.createTextVNode("5")]),Vue.createVNode("li",null,[Vue.createTextVNode("6")]),Vue.createVNode("li",null,[Vue.createTextVNode("7")]),Vue.createVNode("li",null,[Vue.createTextVNode("8")]),Vue.createVNode("li",null,[Vue.createTextVNode("9")]),Vue.createVNode("li",null,[Vue.createTextVNode("0")])]),Vue.createVNode("svg",{width:"0",height:"0"},[Vue.createVNode("filter",{id:"blur"},[Vue.createVNode("feGaussianBlur",{in:"SourceGraphic",stdDeviation:`0 ${t.blur}`},null)])])])])}}),_=p(y),C=p(h),F=Vue.createElementVNode("div",{class:"card-header"},[Vue.createElementVNode("span",{class:"font-medium"},"数字动画组件")],-1),v={class:"flex items-center"},D={class:"flex ml-8"},A=Vue.defineComponent({name:"CountTo",__name:"index",setup(t){return(u,e)=>{const n=Vue.resolveComponent("el-card");return Vue.openBlock(),Vue.createBlock(n,{shadow:"never"},{header:Vue.withCtx(()=>[F]),default:Vue.withCtx(()=>[Vue.createElementVNode("div",v,[Vue.createVNode(Vue.unref(_),{prefix:"$",duration:1e3,color:"#409EFF",fontSize:"2em",startVal:1,endVal:1e3}),Vue.createElementVNode("ul",D,[(Vue.openBlock(),Vue.createElementBlock(Vue.Fragment,null,Vue.renderList([1,6,6,6],(i,V)=>Vue.createVNode(Vue.unref(C),{key:V,i,blur:V,delay:V+1},null,8,["i","blur","delay"])),64))])])]),_:1})}}});export{A as default};
|