vue-amazing-ui/lib/countdown/Countdown.vue2.cjs

An Amazing Vue3 UI Components Library, Using TypeScript.

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),N=require("../utils/index.cjs"),C={class:"countdown-wrap"},F={class:"countdown-time"},T={key:0,class:"time-prefix"},V={key:0,class:"time-suffix"},Y=e.defineComponent({__name:"Countdown",props:{title:{default:void 0},titleStyle:{default:()=>({})},prefix:{default:void 0},suffix:{default:void 0},finish:{default:void 0},future:{type:Boolean,default:!0},format:{default:"HH:mm:ss"},value:{default:0},valueStyle:{default:()=>({})},active:{type:Boolean,default:!0}},emits:["finish"],setup(D,{expose:M,emit:B}){const o=D,s=e.ref(0),a=e.ref(0),n=e.ref(null),g=B,p=N.useSlotsExist(["title","prefix","suffix"]),x=e.computed(()=>p.title||o.title),y=e.computed(()=>p.prefix||o.prefix),k=e.computed(()=>p.suffix||o.suffix),u=e.computed(()=>({showMillisecond:o.format.includes("SSS"),showYear:o.format.includes("Y"),showMonth:o.format.includes("M"),showDay:o.format.includes("D"),showHour:o.format.includes("H"),showMinute:o.format.includes("m"),showSecond:o.format.includes("s")}));e.watch(()=>o.active,t=>{o.future||(t?(s.value=a.value+Date.now(),n.value=requestAnimationFrame(w)):(n.value&&cancelAnimationFrame(n.value),n.value=null))}),e.watch(()=>[o.value,o.future],()=>{h()},{deep:!0}),e.onMounted(()=>{h()});function h(){Number.isFinite(o.value)?(o.future?o.value>Date.now()?s.value=o.value:S():o.value>0?s.value=o.value+Date.now():S(),a.value=s.value-Date.now(),(o.future||!o.future&&o.active)&&(n.value&&cancelAnimationFrame(n.value),n.value=requestAnimationFrame(w))):a.value=0}function S(){a.value=0,g("finish")}function w(){s.value>Date.now()?(a.value=s.value-Date.now(),n.value=requestAnimationFrame(w)):S()}function r(t,l=2){return String(t).padStart(l,"0")}function E(t){let l=o.format;if(u.value.showMillisecond){const v=t%1e3;l=l.replace("SSS",r(v,3))}t=Math.floor(t/1e3);let i;u.value.showYear?(i=Math.floor(t/(3600*24*30*12)),l=l.includes("YY")?l.replace("YY",r(i)):l.replace("Y",String(i))):i=0;let c;u.value.showMonth?(t=t-i*60*60*24*30*12,c=Math.floor(t/(3600*24*30)),l=l.includes("MM")?l.replace("MM",r(c)):l.replace("M",String(c))):c=0;let f;u.value.showDay?(t=t-c*60*60*24*30,f=Math.floor(t/(3600*24)),l=l.includes("DD")?l.replace("DD",r(f)):l.replace("D",String(f))):f=0;let d;u.value.showHour?(t=t-f*60*60*24,d=Math.floor(t/3600),l=l.includes("HH")?l.replace("HH",r(d)):l.replace("H",String(d))):d=0;let m;if(u.value.showMinute?(t=t-d*60*60,m=Math.floor(t/60),l=l.includes("mm")?l.replace("mm",r(m)):l.replace("m",String(m))):m=0,u.value.showSecond){const v=t-m*60;l=l.includes("ss")?l.replace("ss",r(v)):l.replace("s",String(v))}return l}function H(){h()}return M({reset:H}),(t,l)=>(e.openBlock(),e.createElementBlock("div",C,[x.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:"countdown-title",style:e.normalizeStyle(t.titleStyle)},[e.renderSlot(t.$slots,"title",{},()=>[e.createTextVNode(e.toDisplayString(o.title),1)],!0)],4)):e.createCommentVNode("",!0),e.createElementVNode("div",F,[y.value?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[y.value||a.value>0?(e.openBlock(),e.createElementBlock("span",T,[e.renderSlot(t.$slots,"prefix",{},()=>[e.createTextVNode(e.toDisplayString(t.prefix),1)],!0)])):e.createCommentVNode("",!0)],64)):e.createCommentVNode("",!0),t.finish&&a.value===0?(e.openBlock(),e.createElementBlock("span",{key:1,class:"time-value",style:e.normalizeStyle(t.valueStyle)},[e.renderSlot(t.$slots,"finish",{},()=>[e.createTextVNode(e.toDisplayString(t.finish),1)],!0)],4)):(e.openBlock(),e.createElementBlock("span",{key:2,class:"time-value",style:e.normalizeStyle(t.valueStyle)},e.toDisplayString(E(a.value)),5)),k.value?(e.openBlock(),e.createElementBlock(e.Fragment,{key:3},[k.value||a.value>0?(e.openBlock(),e.createElementBlock("span",V,[e.renderSlot(t.$slots,"suffix",{},()=>[e.createTextVNode(e.toDisplayString(t.suffix),1)],!0)])):e.createCommentVNode("",!0)],64)):e.createCommentVNode("",!0)])]))}});exports.default=Y;