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