wikijs-fork/client/js/components/modal-profile-2fa.vue

67 lines
2.0 KiB
Vue
Raw Normal View History

2017-06-12 01:11:01 +00:00
<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>