diff --git a/dist/main.js b/dist/main.js index fb78982..60e521c 100644 --- a/dist/main.js +++ b/dist/main.js @@ -1 +1 @@ -!function(t,n){"object"==typeof exports&&"object"==typeof module?module.exports=n():"function"==typeof define&&define.amd?define([],n):"object"==typeof exports?exports["vue-flip-down"]=n():t["vue-flip-down"]=n()}(window,(function(){return function(t){var n={};function e(i){if(n[i])return n[i].exports;var o=n[i]={i:i,l:!1,exports:{}};return t[i].call(o.exports,o,o.exports,e),o.l=!0,o.exports}return e.m=t,e.c=n,e.d=function(t,n,i){e.o(t,n)||Object.defineProperty(t,n,{enumerable:!0,get:i})},e.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},e.t=function(t,n){if(1&n&&(t=e(t)),8&n)return t;if(4&n&&"object"==typeof t&&t&&t.__esModule)return t;var i=Object.create(null);if(e.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:t}),2&n&&"string"!=typeof t)for(var o in t)e.d(i,o,function(n){return t[n]}.bind(null,o));return i},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,n){return Object.prototype.hasOwnProperty.call(t,n)},e.p="",e(e.s=1)}([function(t,n,e){var i=e(3),o=e(4);"string"==typeof(o=o.__esModule?o.default:o)&&(o=[[t.i,o,""]]);var r={insert:"head",singleton:!1},a=(i(t.i,o,r),o.locals?o.locals:{});t.exports=a},function(t,n,e){t.exports=e(6)},function(t,n,e){"use strict";var i=e(0);e.n(i).a},function(t,n,e){"use strict";var i,o=function(){return void 0===i&&(i=Boolean(window&&document&&document.all&&!window.atob)),i},r=function(){var t={};return function(n){if(void 0===t[n]){var e=document.querySelector(n);if(window.HTMLIFrameElement&&e instanceof window.HTMLIFrameElement)try{e=e.contentDocument.head}catch(t){e=null}t[n]=e}return t[n]}}(),a={};function s(t,n,e){for(var i=0;i div {\n position: absolute;\n left: 0;\n width: 100%;\n height: 50%;\n overflow: hidden;\n -webkit-transform-style: preserve-3d;\n transform-style: preserve-3d;\n}\n.vue-countdown-component .time-box > div > div {\n position: absolute;\n left: 0;\n width: 100%;\n height: 30px;\n}\n.vue-countdown-component .time-box > div.a0 {\n top: 0;\n border-radius: 3px 3px 0 0;\n background-color: #6c96e8;\n -webkit-transform-origin: 50% bottom;\n transform-origin: 50% bottom;\n -webkit-animation-duration: 500ms;\n animation-duration: 500ms;\n -webkit-transform: rotateX(0);\n transform: rotateX(0);\n -webkit-backface-visibility: hidden;\n backface-visibility: hidden;\n z-index: 2;\n}\n.vue-countdown-component .time-box > div.a0.anime {\n -webkit-animation-name: animate-filp;\n animation-name: animate-filp;\n}\n.vue-countdown-component .time-box > div.a0 > div {\n top: 0;\n}\n.vue-countdown-component .time-box > div.b0 {\n top: 15px;\n border-radius: 0 0 3px 3px;\n background-color: #73a1f8;\n -webkit-transform-origin: 50% top;\n transform-origin: 50% top;\n -webkit-animation-duration: 500ms;\n animation-duration: 500ms;\n -webkit-transform: rotateX(180deg);\n transform: rotateX(180deg);\n -webkit-backface-visibility: hidden;\n backface-visibility: hidden;\n z-index: 2;\n}\n.vue-countdown-component .time-box > div.b0 > div {\n bottom: 0;\n}\n.vue-countdown-component .time-box > div.b0.anime {\n -webkit-animation-name: animate-filp2;\n animation-name: animate-filp2;\n}\n.vue-countdown-component .time-box > div.a1 {\n top: 15px;\n border-radius: 0 0 3px 3px;\n background-color: #73a1f8;\n}\n.vue-countdown-component .time-box > div.a1 > div {\n bottom: 0;\n}\n',""]),t.exports=n},function(t,n,e){"use strict";t.exports=function(t){var n=[];return n.toString=function(){return this.map((function(n){var e=function(t,n){var e=t[1]||"",i=t[3];if(!i)return e;if(n&&"function"==typeof btoa){var o=(a=i,s=btoa(unescape(encodeURIComponent(JSON.stringify(a)))),u="sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(s),"/*# ".concat(u," */")),r=i.sources.map((function(t){return"/*# sourceURL=".concat(i.sourceRoot).concat(t," */")}));return[e].concat(r).concat([o]).join("\n")}var a,s,u;return[e].join("\n")}(n,t);return n[2]?"@media ".concat(n[2]," {").concat(e,"}"):e})).join("")},n.i=function(t,e){"string"==typeof t&&(t=[[null,t,""]]);for(var i=0;i[]}},computed:{endTime(){return this.endDate instanceof Date?this.endDate.getTime():Number(this.endDate)>0?Number(this.endDate):0},step(){return 1===this.theme?1:2},arr(){const t=this.timeArray.length,n=this.step,e=[t-1,t-n-1,t-2*n-1,t-3*n-1];return e.length=this.type>1?this.type:1,e}},watch:{timeArray(t,n){const e=[];t.forEach((t,i)=>{t!==n[i]&&(this.$set(this.isAnimate,i,!0),e.push({value:t,index:i}))}),setTimeout(()=>{e.forEach(t=>{this.$set(this.timeArrayT,t.index,t.value)})},350)},endTime(t){t>0&&this.start(!0)}},mounted(){this.start(!0)},beforeDestroy(){clearTimeout(this.timer)},methods:{start(t){clearTimeout(this.timer),this.timer=setTimeout(()=>{let n=this.endTime-(new Date).getTime();n=n<0?0:n;let e=0,i=0,o=0,r=0;const a=Number(this.type);a>=4?(e=Math.floor(n/864e5),i=Math.floor(n/36e5-24*e),o=Math.floor(n/6e4-1440*e-60*i),r=Math.floor(n/1e3-86400*e-3600*i-60*o)):a>=3?(i=Math.floor(n/36e5),o=Math.floor(n/6e4-60*i),r=Math.floor(n/1e3-3600*i-60*o)):a>=2?(o=Math.floor(n/6e4),r=Math.floor(n/1e3-60*o)):r=Math.floor(n/1e3);let s=[];1===Number(this.theme)?(a>=4&&s.push(String(e).padStart(2,"0")),a>=3&&s.push(String(i).padStart(2,"0")),a>=2&&s.push(String(o).padStart(2,"0")),s.push(String(r).padStart(2,"0"))):(a>=4&&s.push(...String(e).padStart(2,"0").split("")),a>=3&&s.push(...String(i).padStart(2,"0").split("")),a>=2&&s.push(...String(o).padStart(2,"0").split("")),s.push(...String(r).padStart(2,"0").split(""))),this.timeArray=s,t&&(this.timeArrayT=[...this.timeArray],this.isAnimate=new Array(this.timeArray.length).fill(!1)),n>0?this.start():this.$emit("timeUp")},1e3)},onAnimateEnd(t){this.$set(this.isAnimate,t,!1)},isTimeUnitShow(t){return!!this.arr.includes(t)&&!(t===this.timeArray.length-1&&!this.timeUnit[3])},setTimeUnit(t){switch(t){case this.timeArray.length-1:return this.timeUnit[3]||"";case this.timeArray.length-this.step-1:return this.timeUnit[2]||"";case this.timeArray.length-2*this.step-1:return this.timeUnit[1]||"";default:return this.timeUnit[0]||""}}}};e(2);var r=function(t,n,e,i,o,r,a,s){var u,c="function"==typeof t?t.options:t;if(n&&(c.render=n,c.staticRenderFns=e,c._compiled=!0),i&&(c.functional=!0),r&&(c._scopeId="data-v-"+r),a?(u=function(t){(t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),o&&o.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(a)},c._ssrRegister=u):o&&(u=s?function(){o.call(this,this.$root.$options.shadowRoot)}:o),u)if(c.functional){c._injectStyles=u;var d=c.render;c.render=function(t,n){return u.call(n),d(t,n)}}else{var m=c.beforeCreate;c.beforeCreate=m?[].concat(m,u):[u]}return{exports:t,options:c}}(o,i,[],!1,null,null,null);r.options.__file="src/app.vue";var a=r.exports;n.default=a}])})); \ No newline at end of file +!function(t,n){"object"==typeof exports&&"object"==typeof module?module.exports=n():"function"==typeof define&&define.amd?define([],n):"object"==typeof exports?exports["vue-flip-down"]=n():t["vue-flip-down"]=n()}(window,(function(){return function(t){var n={};function e(i){if(n[i])return n[i].exports;var o=n[i]={i:i,l:!1,exports:{}};return t[i].call(o.exports,o,o.exports,e),o.l=!0,o.exports}return e.m=t,e.c=n,e.d=function(t,n,i){e.o(t,n)||Object.defineProperty(t,n,{enumerable:!0,get:i})},e.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},e.t=function(t,n){if(1&n&&(t=e(t)),8&n)return t;if(4&n&&"object"==typeof t&&t&&t.__esModule)return t;var i=Object.create(null);if(e.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:t}),2&n&&"string"!=typeof t)for(var o in t)e.d(i,o,function(n){return t[n]}.bind(null,o));return i},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,n){return Object.prototype.hasOwnProperty.call(t,n)},e.p="",e(e.s=1)}([function(t,n,e){var i=e(3),o=e(4);"string"==typeof(o=o.__esModule?o.default:o)&&(o=[[t.i,o,""]]);var r={insert:"head",singleton:!1},a=(i(t.i,o,r),o.locals?o.locals:{});t.exports=a},function(t,n,e){t.exports=e(6)},function(t,n,e){"use strict";var i=e(0);e.n(i).a},function(t,n,e){"use strict";var i,o=function(){return void 0===i&&(i=Boolean(window&&document&&document.all&&!window.atob)),i},r=function(){var t={};return function(n){if(void 0===t[n]){var e=document.querySelector(n);if(window.HTMLIFrameElement&&e instanceof window.HTMLIFrameElement)try{e=e.contentDocument.head}catch(t){e=null}t[n]=e}return t[n]}}(),a={};function s(t,n,e){for(var i=0;i div {\n overflow: hidden;\n -webkit-animation-timing-function: linear;\n animation-timing-function: linear;\n -webkit-animation-duration: 400ms;\n animation-duration: 400ms;\n -webkit-transform: rotateX(-0.01deg);\n transform: rotateX(-0.01deg);\n border-radius: 3px;\n}\n.vue-countdown-component .time-box > div.base {\n position: relative;\n}\n.vue-countdown-component .time-box > div.base .base-b {\n position: absolute;\n left: 0;\n bottom: 0;\n border-radius: 0 0 3px 3px;\n width: 100%;\n height: 100%;\n background-color: #709bf1;\n -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 100%, 0 100%);\n clip-path: polygon(0 50%, 100% 50%, 100% 100%, 0 100%);\n}\n.vue-countdown-component .time-box > div.face {\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n background-color: #6c96e8;\n -webkit-backface-visibility: visible;\n backface-visibility: visible;\n -webkit-clip-path: polygon(0 0, 100% 0, 100% 50%, 0 50%);\n clip-path: polygon(0 0, 100% 0, 100% 50%, 0 50%);\n z-index: 2;\n}\n.vue-countdown-component .time-box > div.face.anime {\n -webkit-animation-name: animate-filp-face;\n animation-name: animate-filp-face;\n}\n.vue-countdown-component .time-box > div.back {\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n background-color: #709bf1;\n -webkit-transform: rotateX(-180deg);\n transform: rotateX(-180deg);\n -webkit-backface-visibility: visible;\n backface-visibility: visible;\n -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 100%, 0 100%);\n clip-path: polygon(0 50%, 100% 50%, 100% 100%, 0 100%);\n}\n.vue-countdown-component .time-box > div.back.anime {\n -webkit-animation-name: animate-filp-back;\n animation-name: animate-filp-back;\n}\n',""]),t.exports=n},function(t,n,e){"use strict";t.exports=function(t){var n=[];return n.toString=function(){return this.map((function(n){var e=function(t,n){var e=t[1]||"",i=t[3];if(!i)return e;if(n&&"function"==typeof btoa){var o=(a=i,s=btoa(unescape(encodeURIComponent(JSON.stringify(a)))),c="sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(s),"/*# ".concat(c," */")),r=i.sources.map((function(t){return"/*# sourceURL=".concat(i.sourceRoot).concat(t," */")}));return[e].concat(r).concat([o]).join("\n")}var a,s,c;return[e].join("\n")}(n,t);return n[2]?"@media ".concat(n[2]," {").concat(e,"}"):e})).join("")},n.i=function(t,e){"string"==typeof t&&(t=[[null,t,""]]);for(var i=0;i[]}},computed:{endTime(){return this.endDate instanceof Date?this.endDate.getTime():Number(this.endDate)>0?Number(this.endDate):0},step(){return 1===this.theme?1:2},arr(){const t=this.timeArray.length,n=this.step,e=[t-1,t-n-1,t-2*n-1,t-3*n-1];return e.length=this.type>1?this.type:1,e}},watch:{timeArray(t,n){const e=[];t.forEach((t,i)=>{t!==n[i]&&(e.push({value:t,index:i}),this.$set(this.isAnimate,i,!0))}),setTimeout(()=>{e.forEach(t=>{this.$set(this.timeArrayT,t.index,t.value)})},350)},endTime(t){t>0&&this.start()}},mounted(){(window.ActiveXObject||"ActiveXObject"in window||window.navigator.userAgent.indexOf("Edge")>-1)&&(this.isIE=!0),this.start(0)},beforeDestroy(){clearTimeout(this.timer)},methods:{start(t=1e3){clearTimeout(this.timer),this.timer=setTimeout(()=>{let t=this.endTime-(new Date).getTime();t=t<0?0:t;let n=0,e=0,i=0,o=0;const r=Number(this.type);r>=4?(n=Math.floor(t/864e5),e=Math.floor(t/36e5-24*n),i=Math.floor(t/6e4-1440*n-60*e),o=Math.floor(t/1e3-86400*n-3600*e-60*i)):r>=3?(e=Math.floor(t/36e5),i=Math.floor(t/6e4-60*e),o=Math.floor(t/1e3-3600*e-60*i)):r>=2?(i=Math.floor(t/6e4),o=Math.floor(t/1e3-60*i)):o=Math.floor(t/1e3);let a=[];1===Number(this.theme)?(r>=4&&a.push(String(n).padStart(2,"0")),r>=3&&a.push(String(e).padStart(2,"0")),r>=2&&a.push(String(i).padStart(2,"0")),a.push(String(o).padStart(2,"0"))):(r>=4&&a.push(...String(n).padStart(2,"0").split("")),r>=3&&a.push(...String(e).padStart(2,"0").split("")),r>=2&&a.push(...String(i).padStart(2,"0").split("")),a.push(...String(o).padStart(2,"0").split(""))),this.timeArray=a,t>0?this.start():this.$emit("timeUp")},t)},onAnimateEnd(t){this.$set(this.isAnimate,t,!1)},isTimeUnitShow(t){return!!this.arr.includes(t)&&!(t===this.timeArray.length-1&&!this.timeUnit[3])},setTimeUnit(t){switch(t){case this.timeArray.length-1:return this.timeUnit[3]||"";case this.timeArray.length-this.step-1:return this.timeUnit[2]||"";case this.timeArray.length-2*this.step-1:return this.timeUnit[1]||"";default:return this.timeUnit[0]||""}}}};e(2);var r=function(t,n,e,i,o,r,a,s){var c,u="function"==typeof t?t.options:t;if(n&&(u.render=n,u.staticRenderFns=e,u._compiled=!0),i&&(u.functional=!0),r&&(u._scopeId="data-v-"+r),a?(c=function(t){(t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),o&&o.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(a)},u._ssrRegister=c):o&&(c=s?function(){o.call(this,this.$root.$options.shadowRoot)}:o),c)if(u.functional){u._injectStyles=c;var p=u.render;u.render=function(t,n){return c.call(n),p(t,n)}}else{var l=u.beforeCreate;u.beforeCreate=l?[].concat(l,c):[c]}return{exports:t,options:u}}(o,i,[],!1,null,null,null);r.options.__file="src/app.vue";var a=r.exports;n.default=a}])})); \ No newline at end of file diff --git a/package.json b/package.json index fa73146..4f1770a 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vue-flip-down", - "version": "1.0.4", + "version": "1.0.5", "description": "vue 翻页效果的倒计时组件", "main": "dist/main.js", "scripts": { diff --git a/src/app.vue b/src/app.vue index d064150..6c00f09 100644 --- a/src/app.vue +++ b/src/app.vue @@ -1,20 +1,21 @@