WIP: Fix security tab buttons

louislam · Nov 3, 2021 · 20b3542 · 20b3542
1 parent 53d90c1
commit 20b3542
Showing 1 changed file with 34 additions and 6 deletions.
diff --git a/src/components/settings/Security.vue b/src/components/settings/Security.vue
@@ -7,7 +7,7 @@
                     {{ $t("Current User") }}: <strong>{{ username }}</strong>
                 </p>
 
-                <h4 class="mt-4 mb-2">{{ $t("Change Password") }}</h4>
+                <h5 class="my-4">{{ $t("Change Password") }}</h5>
                 <form class="mb-3" @submit.prevent="savePassword">
                     <div class="mb-3">
                         <label for="current-password" class="form-label">
@@ -61,9 +61,9 @@
             </template>
 
             <div v-if="!$parent.$parent.settings.disableAuth" class="mt-5 mb-3">
-                <h4 class="mt-4 mb-2">
+                <h5 class="my-4">
                     {{ $t("Two Factor Authentication") }}
-                </h4>
+                </h5>
                 <div class="mb-4">
                     <button
                         class="btn btn-primary me-2"
@@ -77,7 +77,7 @@
 
             <div class="my-4">
                 <!-- Advanced -->
-                <h4 class="mt-4 mb-2">{{ $t("Advanced") }}</h4>
+                <h5 class="my-4">{{ $t("Advanced") }}</h5>
 
                 <div class="mb-4">
                     <button v-if="$parent.$parent.settings.disableAuth" class="btn btn-outline-primary me-2 mb-2" @click="enableAuth">{{ $t("Enable Auth") }}</button>
@@ -210,11 +210,13 @@
 
 <script>
 import Confirm from "../../components/Confirm.vue";
+import TwoFADialog from "../../components/TwoFADialog.vue";
 import jwtDecode from "jwt-decode";
 
 export default {
     components: {
-        Confirm
+        Confirm,
+        TwoFADialog
     },
 
     data() {
@@ -257,8 +259,34 @@ export default {
             const jwtPayload = jwtDecode(jwtToken);
             this.username = jwtPayload.username;
         },
+
+        disableAuth() {
+            this.$parent.$parent.settings.disableAuth = true;
+            this.$parent.$parent.saveSettings();
+        },
+
+        enableAuth() {
+            this.$parent.$parent.settings.disableAuth = false;
+            this.$parent.$parent.saveSettings();
+            this.$root.storage().removeItem("token");
+        },
+
+        confirmDisableAuth() {
+            this.$refs.confirmDisableAuth.show();
+        },
+
     },
 };
 </script>
 
-<style></style>
+<style lang="scss" scoped>
+@import "../../assets/vars.scss";
+
+h5:after {
+    content: "";
+    display: block;
+    width: 50%;
+    padding-top: 8px;
+    border-bottom: 1px solid $dark-border-color;
+}
+</style>