mirror of
https://github.com/Bubka/2FAuth.git
synced 2025-08-14 07:48:37 +02:00
Add user preference to auto-close OTP after timeout
This commit is contained in:
@ -53,6 +53,7 @@
|
||||
const dots = ref()
|
||||
const totpLooper = ref()
|
||||
const otpSpanTag = ref()
|
||||
const autoCloseTimeout = ref(null)
|
||||
|
||||
watch(
|
||||
() => props.icon,
|
||||
@ -121,6 +122,10 @@
|
||||
try {
|
||||
await getOtp()
|
||||
focusOnOTP()
|
||||
|
||||
if (user.preferences.getOtpOnRequest && parseInt(user.preferences.autoCloseTimeout) > 0) {
|
||||
startAutoCloseTimer()
|
||||
}
|
||||
}
|
||||
catch(error) {
|
||||
clearOTP()
|
||||
@ -191,6 +196,15 @@
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Triggers the component closing
|
||||
*/
|
||||
function closeMe() {
|
||||
emit("please-close-me");
|
||||
revealPassword.value = false
|
||||
clearOTP()
|
||||
}
|
||||
|
||||
/**
|
||||
* Reset component's refs
|
||||
*/
|
||||
@ -199,6 +213,7 @@
|
||||
otpauthParams.value.service = otpauthParams.value.account = otpauthParams.value.icon = otpauthParams.value.otp_type = otpauthParams.value.secret = ''
|
||||
password.value = '... ...'
|
||||
hasTOTP.value = false
|
||||
clearTimeout(autoCloseTimeout.value)
|
||||
|
||||
totpLooper.value?.clearLooper();
|
||||
}
|
||||
@ -226,9 +241,7 @@
|
||||
user.logout({ kicked: true})
|
||||
}
|
||||
else if(user.preferences.closeOtpOnCopy && (permit_closing || false) === true) {
|
||||
emit("please-close-me");
|
||||
revealPassword.value = false
|
||||
clearOTP()
|
||||
closeMe()
|
||||
}
|
||||
|
||||
if(user.preferences.clearSearchOnCopy) {
|
||||
@ -273,6 +286,17 @@
|
||||
show,
|
||||
clearOTP
|
||||
})
|
||||
|
||||
/**
|
||||
* Starts an auto close timer
|
||||
*/
|
||||
function startAutoCloseTimer() {
|
||||
let duration = parseInt(user.preferences.autoCloseTimeout) // in minutes
|
||||
|
||||
autoCloseTimeout.value = setTimeout(function() {
|
||||
closeMe()
|
||||
}, duration * 60 * 1000);
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
|
@ -19,22 +19,29 @@
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
isIndented: Boolean,
|
||||
isDisabled: Boolean,
|
||||
})
|
||||
|
||||
const selected = ref(props.modelValue)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="field">
|
||||
<label class="label" v-html="$t(label)"></label>
|
||||
<div class="control">
|
||||
<div class="select">
|
||||
<select v-model="selected" v-on:change="$emit('update:modelValue', $event.target.value)">
|
||||
<option v-for="option in options" :value="option.value">{{ $t(option.text) }}</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="field is-flex">
|
||||
<div v-if="isIndented" class="mx-2 pr-1" :style="{ 'opacity': isDisabled ? '0.5' : '1' }">
|
||||
<FontAwesomeIcon class="has-text-grey" :icon="['fas', 'chevron-right']" transform="rotate-135"/>
|
||||
</div>
|
||||
<div>
|
||||
<label class="label" v-html="$t(label)" :style="{ 'opacity': isDisabled ? '0.5' : '1' }"></label>
|
||||
<div class="control">
|
||||
<div class="select">
|
||||
<select v-model="selected" v-on:change="$emit('update:modelValue', $event.target.value)" :disabled="isDisabled">
|
||||
<option v-for="option in options" :value="option.value">{{ $t(option.text) }}</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<FieldError v-if="fieldError != undefined" :error="fieldError" :field="fieldName" />
|
||||
<p class="help" v-html="$t(help)" v-if="help"></p>
|
||||
</div>
|
||||
<FieldError v-if="fieldError != undefined" :error="fieldError" :field="fieldName" />
|
||||
<p class="help" v-html="$t(help)" v-if="help"></p>
|
||||
</div>
|
||||
</template>
|
Reference in New Issue
Block a user