<template>
<view class="wrap">
劃消：{{ sdNum }} * {{ sdNum }}
<view class="btn" style="padding: 32rpx; background: pink" @click="clickBtn">點選劃消按鈕</view>
<view class="btn" style="padding: 32rpx; background: pink" @click="startGame"
>點選劃消開始遊戲按鈕</view
>
<view class="btn" style="padding: 32rpx; background: pink" @click="endGame"
>點選劃消結束後,計算時間遊戲按鈕</view
>
<view class="time">{{ startTime }}</view>
<view>99999--隨機需要劃消的值：{{ randomNum }}</view>
<view>88888--隨機需要劃消的值一共出現的次數：{{ repeatNum }}</view>
</view>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import { onShow } from '@dcloudio/uni-app'
// import { taskDetail, memberInfo } from '@/api/hmm'
// import store from '@/store'
// import { transformTimeTwo } from '@/utils/hmm'
const sdNum = ref(5)
// const countDownRef = ref(null)
const rightList = ref([])
// 隨機值
const randomNum = ref(0)
// 重複的隨機值 次數
const repeatNum = ref(0)
// 倒數計時時間
const goToState = ref(false)
const timmer = ref(null)
const startTime = ref('03:00')
const stopTime = ref(0)
const newDateTime = ref(0)
onShow(() => {
generateShuDu()
})
// 初始化數獨
const generateArr = () => {
const arr = []
for (let i = 0; i < sdNum.value; i++) {
arr[i] = []
for (let j = 0; j < sdNum.value; j++) {
arr[i][j] = Math.floor(Math.random() * 9) + 1
}
}
return arr
}
const generateShuDu = () => {
rightList.value = []
randomNum.value = 0
repeatNum.value = 0
const arr = generateArr()
console.log(arr)
// 隨機數去重
const duplicateRemoval = []
for (let i = 0; i < arr.length; i++) {
// console.log(arr[i])
for (let j = 0; j < arr[i].length; j++) {
if (duplicateRemoval.indexOf(arr[i][j]) == -1) {
duplicateRemoval.push(arr[i][j])
}
// console.log(arr[i][j])
}
}
const randomValue = Math.floor(Math.random() * duplicateRemoval.length)
console.log(duplicateRemoval)
console.log(randomValue)
randomNum.value = duplicateRemoval[randomValue]
rightList.value = duplicateRemoval
console.log(222)
console.log(randomNum.value)
for (let i = 0; i < arr.length; i++) {
for (let j = 0; j < arr[i].length; j++) {
if (arr[i][j] == randomNum.value) {
repeatNum.value = repeatNum.value + 1
}
}
}
console.log(repeatNum.value)
}
//
// 點選重新開始了數獨遊戲
const clickBtn = () => {
generateShuDu()
}
// 點選開始計時
const startGame = () => {
if (goToState.value == false) {
goToState.value = true
clearInterval(timmer.value)
timmer.value = null
startTime.value = '03:00'
stopTime.value = new Date().getTime() + 3 * 60 * 1000
// stopTime.value = new Date().getTime() + 5 * 1000
timmer.value = setInterval(() => {
newDateTime.value = stopTime.value - new Date().getTime()
console.log(newDateTime.value)
console.log(22)
if (newDateTime.value <= 0) {
startTime.value = '00:00'
clearInterval(timmer.value)
console.log('遊戲超時自動結束')
} else {
startTime.value = transformTime(newDateTime.value)
}
}, 1000)
}
}
// 點選結束 計算分數
const endGame = () => {
if (goToState.value == true) {
goToState.value = false
clearInterval(timmer.value)
timmer.value = null
const residueTime = transformTime(newDateTime.value, 'stop')
console.log(residueTime)
}
}
// 時間轉換
const transformTime = (date, state) => {
var datetime = ''
//計算出小時數
var leave1 = date % (24 * 3600 * 1000) //計算天數後剩餘的毫秒數
//計算相差分鐘數
var leave2 = leave1 % (3600 * 1000) //計算小時數後剩餘的毫秒數
var minutes =
Math.floor(leave2 / (60 * 1000)) < 10
? '0' + Math.floor(leave2 / (60 * 1000))
: Math.floor(leave2 / (60 * 1000))
//計算相差秒數
var leave3 = leave2 % (60 * 1000) //計算分鐘數後剩餘的毫秒數
var seconds =
Math.round(leave3 / 1000) < 10 ? '0' + Math.round(leave3 / 1000) : Math.round(leave3 / 1000)
if (state == 'stop') {
const secondsNum = Number(seconds) + Number(minutes) * 60
return secondsNum
} else {
datetime = minutes + ':' + seconds
return datetime
}
}
</script>
<style lang="scss"></style>