去除点击蒙版也会触发成功的bug

This commit is contained in:
lq
2025-06-21 13:44:35 +08:00
parent 54f620d92f
commit 23945a58de

View File

@ -1,14 +1,7 @@
<template> <template>
<div> <div>
<div <div v-show="show" :class="['vue-puzzle-vcode', { show_: show }]" @click.stop="onMaskClick">
v-show="show" <div class="vue-auth-box_" @mousedown.stop @touchstart.stop @click.stop>
:class="['vue-puzzle-vcode', { show_: show }]"
@mousedown="onCloseMouseDown"
@mouseup="onCloseMouseUp"
@touchstart="onCloseMouseDown"
@touchend="onCloseMouseUp"
>
<div class="vue-auth-box_" @mousedown.stop @touchstart.stop>
<div style="margin-bottom: 10px; fonst-size: 16px; color: #211f24">输入图形验证码</div> <div style="margin-bottom: 10px; fonst-size: 16px; color: #211f24">输入图形验证码</div>
<div class="auth-body_" :style="`height: ${canvasHeight}px`"> <div class="auth-body_" :style="`height: ${canvasHeight}px`">
<!-- 主图有缺口 --> <!-- 主图有缺口 -->
@ -144,7 +137,7 @@ const puzzleBaseSize = computed(() => {
const sliderBaseSize = computed(() => { const sliderBaseSize = computed(() => {
return Math.max(Math.min(Math.round(props.sliderSize), Math.round(props.canvasWidth * 0.5)), 10); return Math.max(Math.min(Math.round(props.sliderSize), Math.round(props.canvasWidth * 0.5)), 10);
}); });
const onMaskClick = () => {};
// 生命周期 // 生命周期
onMounted(() => { onMounted(() => {
document.addEventListener('mousemove', onRangeMouseMove, { passive: false }); document.addEventListener('mousemove', onRangeMouseMove, { passive: false });
@ -188,19 +181,19 @@ function onClose() {
} }
} }
function onCloseMouseDown() { // function onCloseMouseDown() {
closeDown.value = true; // closeDown.value = true;
init(true); // init(true);
//给父组件传一个状态 // //给父组件传一个状态
emit('submit', 'F'); // emit('submit', 'F');
} // }
function onCloseMouseUp() { // function onCloseMouseUp() {
if (closeDown.value) { // if (closeDown.value) {
onClose(); // onClose();
} // }
closeDown.value = false; // closeDown.value = false;
} // }
function onRangeMouseDown(e) { function onRangeMouseDown(e) {
if (isCanSlide.value) { if (isCanSlide.value) {