67 lines
2.0 KiB
Vue
67 lines
2.0 KiB
Vue
<template lang="pug">
|
|
transition(:duration="400")
|
|
.modal(v-show='isShown', v-cloak)
|
|
transition(name='modal-background')
|
|
.modal-background(v-show='isShown')
|
|
.modal-container
|
|
transition(name='modal-content')
|
|
.modal-content(v-show='isShown')
|
|
template(v-if='step === "qr"')
|
|
header.is-blue Setup your 2FA app
|
|
section.modal-loading
|
|
i
|
|
span Wiki.js {{ mode }} in progress...
|
|
em Please wait
|
|
template(v-if='step === "error"')
|
|
header.is-red Error
|
|
section.modal-loading
|
|
span {{ error }}
|
|
footer
|
|
a.button.is-grey.is-outlined(@click='cancel') Discard
|
|
template(v-if='step === "confirm"')
|
|
header.is-blue Two-Factor Authentication
|
|
section
|
|
label.label Do you want to enable 2FA?
|
|
span.note Two-Factor Authentication (2FA) provides an extra layer of security for your account. Upon login, you will be prompted to enter a token generated by a 2FA app (e.g. Authy, Google Authenticator, etc.).
|
|
footer
|
|
a.button.is-grey.is-outlined(@click='cancel') Discard
|
|
a.button.is-blue(@click='confirm') Setup
|
|
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'modal-profile-2fa',
|
|
data() {
|
|
return {
|
|
isLoading: false,
|
|
error: ''
|
|
}
|
|
},
|
|
computed: {
|
|
isShown() {
|
|
return this.$store.state.modalProfile2fa.shown
|
|
},
|
|
step() {
|
|
return this.$store.state.modalProfile2fa.step
|
|
}
|
|
},
|
|
methods: {
|
|
cancel() {
|
|
this.isLoading = false
|
|
this.$store.dispatch('modalProfile2fa/close')
|
|
},
|
|
confirm() {
|
|
this.$http.post('/admin/profile/2fa', {
|
|
action: 'setup'
|
|
}).then(resp => {
|
|
this.$store.commit('modalProfile2fa/stepChange', 'qr')
|
|
}).catch(err => {
|
|
this.$store.commit('modalProfile2fa/stepChange', 'error')
|
|
this.error = err.body.msg
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|