mint-tow/src/components/starTimer.vue
2024-06-25 13:45:57 +08:00

78 lines
2.0 KiB
Vue

<template>
<div>
{{hour}}h:{{min}}m:{{sec}}s
</div>
</template>
<script setup>
import { ref, onMounted, onUnmounted, defineComponent } from 'vue';
const props = defineProps({
getAddress: {
type: String,
required: true,
},
openNft: {
type: Number,
required: true,
}
});
let remainingTime = ref(0); // 24小时 = 86400秒
const day = ref(0);
const hour = ref(0);
const min = ref(0);
const sec = ref(0);
let intervalId = null
const emit = defineEmits(['stopTime'])
const starTimer = () => {
let nowTime = new Date().getTime();
// let str = localStorage.getItem(`openTime${props.getAddress}`)
// let strTime = (1718098200000 - nowTime) / 1000
let strTime = (props.openNft - nowTime) / 1000
intervalId = setInterval(() => {
if (strTime >= 1) {
// remainingTime.value -= 1;
strTime--;
//js获取剩余天数
let d = Math.floor(strTime / 60 / 60 / 24);
d = d < 10 ? "0" + d : d;
//js获取剩余小时
let h = Math.floor((strTime / 60 / 60) % 24);
h = h < 10 ? "0" + h : h;
//js获取剩余分钟
let m = Math.floor((strTime / 60) % 60);
m = m < 10 ? "0" + m : m;
//js获取剩余秒
let s = Math.floor(strTime % 60);
s = s < 10 ? "0" + s : s;
//赋值给当前变量
day.value = d;
hour.value = h;
min.value = m;
sec.value = s;
} else {
emit('stopTime')
localStorage.removeItem(`openTime${props.getAddress}`)
clearInterval(intervalId);
intervalId = null
}
}, 1000);
}
// 判断是否登录 判断是否显示mint成功倒计时
const isOpenTime = () => {
let openTime = localStorage.getItem(`openTime${props.getAddress}`)
if(props.getAddress) {
// if(props.getAddress == openTime.split('-')[0]) {
starTimer()
// }
}
}
onMounted(() => {
isOpenTime()
// 清除定时器
onUnmounted(() => {
clearInterval(intervalId);
});
});
</script>