Create TwoFactorAuthentication Popup

resources/js/views/Auth/SignIn.vue

@@ -303,7 +303,7 @@
                                 if(! recovery) {
 
                                     this.$refs.two_factor_authentication.setErrors({
-                                        'Two Factor Authentication' : 'Incorrect code' 
+                                        'Two Factor Authentication' : this.$t('validation_errors.incorrect_2fa_code')
                                     })
                                 } 
                                 
@@ -311,7 +311,7 @@
                                 if(recovery) {
                                     
                                     this.$refs.two_factor_recovery.setErrors({
-                                        'Two Factor Recovery' : 'Incorrect recovery code' 
+                                        'Two Factor Recovery' : this.$t('validation_errors.incorrect_2fa_recovery_code')
                                     })
                                 }
                             }

resources/js/views/Platform.vue

@@ -29,12 +29,15 @@
 
         <!--Others-->
         <DragUI />
+        <TwoFactorAuthenticationConfirm />
+
 
         <router-view :class="{'is-scaled-down': isScaledDown}" />
     </div>
 </template>
 
 <script>
+    import TwoFactorAuthenticationConfirm from '@/components/Others/TwoFactorAuthenticationConfirm'
     import MultiSelectToolbarMobile from '@/components/FilesView/MultiSelectToolbarMobile'
     import FileSortingMobile from '@/components/FilesView/FileSortingMobile'
     import SidebarNavigation from '@/components/Sidebar/SidebarNavigation'
@@ -56,6 +59,7 @@
     export default {
         name: 'Platform',
         components: {
+            TwoFactorAuthenticationConfirm,
             MultiSelectToolbarMobile,
             CreateFolderPopup,
             FileSortingMobile,

resources/js/views/User/Password.vue

@@ -32,6 +32,27 @@
                 </div>
             </ValidationObserver>
         </PageTabGroup>
+
+        <PageTabGroup class="form block-form">
+            <FormLabel> Two Factor Authentication </FormLabel>
+
+            <div class="block-wrapper">
+                    <div class="input-wrapper">
+                        <div class="inline-wrapper">
+                            <div class="switch-label">
+                                <label class="input-label">
+                                    Enable / Disable Two factor authentication
+                                </label>
+                                <small class="input-help" v-html="$t('admin_settings.others.allow_registration_help')"></small>
+                            </div>
+                            <SwitchInput @click.native.prevent.stop="open2faPopup"
+                                         class="switch"
+                                         :state="user.data.attributes.two_factor_authentication"
+                            />
+                        </div>
+                    </div>
+                </div>
+        </PageTabGroup>
     </PageTab>
 </template>
 
@@ -45,6 +66,8 @@
     import PageTab from '@/components/Others/Layout/PageTab'
     import PageHeader from '@/components/Others/PageHeader'
     import ThemeLabel from '@/components/Others/ThemeLabel'
+    import SwitchInput from '@/components/Others/Forms/SwitchInput'
+    import {mapGetters} from 'vuex'
     import {required} from 'vee-validate/dist/rules'
     import {events} from '@/bus'
     import axios from 'axios'
@@ -58,12 +81,16 @@
             ValidationProvider,
             ValidationObserver,
             UserImageInput,
+            SwitchInput,
             MobileHeader,
             PageHeader,
             ButtonBase,
             ThemeLabel,
             required,
         },
+        computed: {
+            ...mapGetters(['user'])
+        },
         data() {
             return {
                 newPasswordConfirmation: '',
@@ -112,6 +139,9 @@
                             }
                         }
                     })
+            },
+            open2faPopup() {
+                events.$emit('popup:open', {name: 'two-factor-authentication-confirm'})
             }
         }
     }