f
This commit is contained in:
@@ -23,7 +23,7 @@
|
|||||||
<button class="refresh-btn" @click="refreshCaptcha" :disabled="isRefreshing">
|
<button class="refresh-btn" @click="refreshCaptcha" :disabled="isRefreshing">
|
||||||
{{ isRefreshing ? '刷新中...' : '刷新验证' }}
|
{{ isRefreshing ? '刷新中...' : '刷新验证' }}
|
||||||
</button>
|
</button>
|
||||||
<button class="confirm-btn" :disabled="clickedList.length < 4 || !!successMessage" @click="handleConfirm">
|
<button class="confirm-btn" :disabled="clickedList.length < 3 || !!successMessage" @click="handleConfirm">
|
||||||
确认
|
确认
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
@@ -47,8 +47,8 @@ const canvasWidth = 300
|
|||||||
const canvasHeight = 180
|
const canvasHeight = 180
|
||||||
const bgImgUrl = '/image/clickCaptcha.jpg' // 可替换为任意背景图
|
const bgImgUrl = '/image/clickCaptcha.jpg' // 可替换为任意背景图
|
||||||
|
|
||||||
const allChars = ['大', '数', '据', '天', '远', '风', '险', '报', '告']
|
const allChars = ['大', '数', '据', '天', '远', '风', '险', '报', '告', '智', '能', '查']
|
||||||
const targetChars = ref(['天', '远', '数', '据']) // 目标点击顺序固定
|
const targetChars = ref(['智', '能', '查']) // 目标点击顺序固定
|
||||||
const charPositions = ref([]) // [{char, x, y, w, h}]
|
const charPositions = ref([]) // [{char, x, y, w, h}]
|
||||||
const clickedIndex = ref(0)
|
const clickedIndex = ref(0)
|
||||||
const errorMessage = ref('')
|
const errorMessage = ref('')
|
||||||
@@ -127,14 +127,14 @@ function refreshCaptcha() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function generateCaptcha() {
|
function generateCaptcha() {
|
||||||
// 乱序排列7个字
|
// 乱序排列所有字
|
||||||
const chars = [...allChars]
|
const chars = [...allChars]
|
||||||
for (let i = chars.length - 1; i > 0; i--) {
|
for (let i = chars.length - 1; i > 0; i--) {
|
||||||
const j = Math.floor(Math.random() * (i + 1))
|
const j = Math.floor(Math.random() * (i + 1))
|
||||||
;[chars[i], chars[j]] = [chars[j], chars[i]]
|
;[chars[i], chars[j]] = [chars[j], chars[i]]
|
||||||
}
|
}
|
||||||
currentChars = chars
|
currentChars = chars
|
||||||
targetChars.value = ['天', '远', '数', '据']
|
targetChars.value = ['智', '能', '查']
|
||||||
clickedIndex.value = 0
|
clickedIndex.value = 0
|
||||||
errorMessage.value = ''
|
errorMessage.value = ''
|
||||||
successMessage.value = ''
|
successMessage.value = ''
|
||||||
@@ -190,13 +190,13 @@ function handleCanvasClick(e) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function handleConfirm() {
|
function handleConfirm() {
|
||||||
if (clickedList.value.length < 4) {
|
if (clickedList.value.length < 3) {
|
||||||
errorMessage.value = '请依次点击4个字'
|
errorMessage.value = '请依次点击3个字'
|
||||||
setTimeout(() => (errorMessage.value = ''), 1200)
|
setTimeout(() => (errorMessage.value = ''), 1200)
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
const userSeq = clickedList.value
|
const userSeq = clickedList.value
|
||||||
.slice(0, 4)
|
.slice(0, 3)
|
||||||
.map(item => item.char)
|
.map(item => item.char)
|
||||||
.join('')
|
.join('')
|
||||||
if (userSeq === '智能查') {
|
if (userSeq === '智能查') {
|
||||||
|
|||||||
Reference in New Issue
Block a user