feat: add verification comp【31315a7f】
parent
3fc27ff171
commit
111c0eb93f
|
@ -1,9 +1,8 @@
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import type { ComponentInternalInstance } from 'vue';
|
|
||||||
|
|
||||||
import type { VerificationProps } from '../types';
|
import type { VerificationProps } from '../types';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
|
type ComponentInternalInstance,
|
||||||
getCurrentInstance,
|
getCurrentInstance,
|
||||||
nextTick,
|
nextTick,
|
||||||
onMounted,
|
onMounted,
|
||||||
|
@ -21,6 +20,44 @@ import { resetSize } from '../utils/util';
|
||||||
* VerifyPoints
|
* VerifyPoints
|
||||||
* @description 点选
|
* @description 点选
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
// const props = defineProps({
|
||||||
|
// barSize: {
|
||||||
|
// default() {
|
||||||
|
// return {
|
||||||
|
// height: '40px',
|
||||||
|
// width: '310px',
|
||||||
|
// };
|
||||||
|
// },
|
||||||
|
// type: Object,
|
||||||
|
// },
|
||||||
|
// captchaType: {
|
||||||
|
// default() {
|
||||||
|
// return 'VerifyPoints';
|
||||||
|
// },
|
||||||
|
// type: String,
|
||||||
|
// },
|
||||||
|
// imgSize: {
|
||||||
|
// default() {
|
||||||
|
// return {
|
||||||
|
// height: '155px',
|
||||||
|
// width: '310px',
|
||||||
|
// };
|
||||||
|
// },
|
||||||
|
// type: Object,
|
||||||
|
// },
|
||||||
|
// // 弹出式pop,固定fixed
|
||||||
|
// mode: {
|
||||||
|
// default: 'fixed',
|
||||||
|
// type: String,
|
||||||
|
// },
|
||||||
|
// // 间隔
|
||||||
|
// vSpace: {
|
||||||
|
// default: 5,
|
||||||
|
// type: Number,
|
||||||
|
// },
|
||||||
|
// });
|
||||||
|
|
||||||
defineOptions({
|
defineOptions({
|
||||||
name: 'VerifyPoints',
|
name: 'VerifyPoints',
|
||||||
});
|
});
|
||||||
|
@ -90,7 +127,7 @@ onMounted(() => {
|
||||||
const canvas = ref(null);
|
const canvas = ref(null);
|
||||||
|
|
||||||
// 获取坐标
|
// 获取坐标
|
||||||
const getMousePos = function (_obj: any, e: any) {
|
const getMousePos = function (obj: any, e: any) {
|
||||||
const x = e.offsetX;
|
const x = e.offsetX;
|
||||||
const y = e.offsetY;
|
const y = e.offsetY;
|
||||||
return { x, y };
|
return { x, y };
|
||||||
|
@ -153,7 +190,7 @@ function canvasClick(e: any) {
|
||||||
if (res.repCode === '0000') {
|
if (res.repCode === '0000') {
|
||||||
barAreaColor.value = '#4cae4c';
|
barAreaColor.value = '#4cae4c';
|
||||||
barAreaBorderColor.value = '#5cb85c';
|
barAreaBorderColor.value = '#5cb85c';
|
||||||
text.value = $t('ui.captcha.sliderSuccessText');
|
text.value = $t('ui.captcha.success');
|
||||||
bindingClick.value = false;
|
bindingClick.value = false;
|
||||||
if (mode.value === 'pop') {
|
if (mode.value === 'pop') {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
|
@ -190,7 +227,7 @@ async function getPictrue() {
|
||||||
backToken.value = res.data.repData.token;
|
backToken.value = res.data.repData.token;
|
||||||
secretKey.value = res.data.repData.secretKey;
|
secretKey.value = res.data.repData.secretKey;
|
||||||
poinTextList.value = res.data.repData.wordList;
|
poinTextList.value = res.data.repData.wordList;
|
||||||
text.value = `${$t('ui.captcha.clickInOrder')}【${poinTextList.value.join(',')}】`;
|
text.value = `${$t('ui.captcha.point')}【${poinTextList.value.join(',')}】`;
|
||||||
} else {
|
} else {
|
||||||
text.value = res?.data?.repMsg;
|
text.value = res?.data?.repMsg;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue