@tapni/auth 0.0.169 → 0.0.171

package/src/views/MFA.vue

@@ -1,116 +1,102 @@
 <template>
-    <div class="page-login content-boxed content-boxed-padding">
-        <a v-if="isModal" @click="close" class="color-black pull-right pointer" style="margin-top: 0px; position: absolute; right: -20px; text-align: right;">
-          <i class="font-17 color-black">
-            <img src="https://cdn.tapni.co/icons/down-arrow.png" class="responsive-image" style="width: 35%;"/>
-          </i>
-        </a>
-        <h4 style="text-align: center; width: 80%; margin: 0 auto; margin-top: 50px;">
-          2-Step Verification
-        </h4>
-        <br>
+	<div class="page-login content-boxed content-boxed-padding">
+		<a v-if="isModal" @click="close" class="color-black pull-right pointer" style="margin-top: 0px; position: absolute; right: -20px; text-align: right">
+			<i class="font-17 color-black">
+				<img src="https://cdn.tapni.co/icons/down-arrow.png" class="responsive-image" style="width: 35%" />
+			</i>
+		</a>
+		<h4 style="text-align: center; width: 80%; margin: 0 auto; margin-top: 50px">2-Step Verification</h4>
+		<br />
 
-        <div class="qrCodeLoginContainer center-text">
+		<div class="qrCodeLoginContainer center-text">
+			<div>
+				Enable Multi-Factor Authentication
+				<div class="ios-switch" style="display: inline-block; float: right">
+					<input v-model="mfaEnable" type="checkbox" name="ios-switch" class="ios-switch-checkbox" :id="'mfa-open-switch'" />
+					<label class="ios-switch-label" :for="'mfa-open-switch'"></label>
+				</div>
+			</div>
+			<br />
+			<div v-show="mfaEnable && !account.mfaEnabled" style="text-align: center">
+				<div id="qrCodeContainer" class="qrCodeRounded" style="max-width: 100%" />
+				<br />
+				<p class="bold pointer font-16 underline" @click="copy(otpSecret)">{{ otpSecret }}</p>
+				<br />
+				<br />
+				<div style="margin: 0 auto; width: 85%; text-align: center">
+					<h5 class="">Scan the QR code above or enter the secret key into your authenticator app.</h5>
+					<br />
+				</div>
+			</div>
+			<form @submit.prevent="validateMFA" v-if="account.mfaEnabled !== mfaEnable">
+				<button type="submit" class="button black-button google-button bg-tapni-grey button-90 button-center uppercase bold full-top pointer">
+					<span v-if="!loading">{{ ssoLang[appLanguage].continue }}</span>
+					<span v-else class="button--loading button__loader"></span>
+				</button>
+				<a href="javascript:;" @click="cancelMFA">Cancel</a>
+			</form>
+			<div v-else style="margin: 0 auto; width: 100%; text-align: center">
+				<div>
+					<h5 v-if="mfaEnable" class="">
+						Your account is protected via <br />
+						multi-factor authentication (MFA) ✅
+					</h5>
+					<h5 v-else class="">Protect your account from unauthorized access by enabling multi-factor authentication (MFA)</h5>
 
-          <div>
-            Enable Multi-Factor Authentication
-            <div class="ios-switch" style="display: inline-block;float: right">
-              <input
-                  v-model="mfaEnable"
-                  type="checkbox"
-                  name="ios-switch"
-                  class="ios-switch-checkbox"
-                  :id="'mfa-open-switch'"
-              />
-              <label class="ios-switch-label" :for="'mfa-open-switch'"></label>
-            </div>
-          </div>
-          <br>
-          <div v-show="mfaEnable && !account.mfaEnabled" style="text-align: center;">
-            <div id="qrCodeContainer"
-                 class="qrCodeRounded"
-                 style="max-width: 100%;"/>
-            <br>
-            <p class="bold pointer font-16 underline" @click="copy(otpSecret)"> {{ otpSecret }}</p>
-            <br>
-            <br>
-            <div style="margin: 0 auto; width: 85%; text-align: center;">
-              <h5 class="">Scan the QR code above or enter the secret key into your authenticator app.</h5>
-              <br>
-            </div>
-          </div>
-          <form @submit.prevent="validateMFA" v-if="account.mfaEnabled !== mfaEnable">
-            <button
-                type="submit"
-                class="button black-button google-button bg-tapni-grey button-90 button-center uppercase bold full-top pointer"
-            >
-              <span v-if="!loading">{{ ssoLang[appLanguage].continue }}</span>
-              <span v-else class="button--loading button__loader"></span>
-            </button>
-            <a href="javascript:;" @click="cancelMFA">Cancel</a>
-          </form>
-          <div v-else style="margin: 0 auto; width: 100%; text-align: center;">
-            <div>
-              <h5 v-if="mfaEnable" class="">
-                Your account is protected via <br> multi-factor authentication (MFA) ✅
-              </h5>
-              <h5 v-else class="">Protect your account from unauthorized access by enabling multi-factor authentication (MFA)</h5>
-
-              <a class="half-top" href="javascript:;" @click="cancelMFA">Go Back to Account Settings</a>
-            </div>
-          </div>
-        </div>
-    </div>
+					<a class="half-top" href="javascript:;" @click="cancelMFA">Go Back to Account Settings</a>
+				</div>
+			</div>
+		</div>
+	</div>
 </template>
 
-
 <script>
-import MFAAuthMixin from "../mixins/mfa-auth.mixin";
-import AuthMixin from "../mixins/auth.mixin";
-import AuthService from '../services/AuthService'
-import to from "await-to-js";
-import {EventBus} from "@/store/event-bus.js";
+import MFAAuthMixin from '../mixins/mfa-auth.mixin';
+import AuthMixin from '../mixins/auth.mixin';
+import AuthService from '../services/AuthService';
+import to from 'await-to-js';
+import { EventBus } from '@/store/event-bus.js';
 
 export default {
-  name: "AuthMFA",
-  mixins: [AuthMixin, MFAAuthMixin],
-  props: {
-    payload: {
-      type: Object,
-      default: {}
-    },
-  },
-  mounted() {
-    if (!this.isLoggedIn) this.$router.push('/login');
-  },
-  methods: {
-    close () {
-      EventBus.$emit('ssoEvent', {name: 'toggleAuthModal', data: true})
-    },
-    async submit() {
-      let data = {
-        otpToken: this.otpToken,
-        otpSecret: this.otpSecret,
-        enable: this.mfaEnable,
-      };
+	name: 'AuthMFA',
+	mixins: [AuthMixin, MFAAuthMixin],
+	props: {
+		payload: {
+			type: Object,
+			default: {}
+		}
+	},
+	mounted() {
+		if (!this.isLoggedIn) this.$router.push('/login');
+	},
+	methods: {
+		close() {
+			EventBus.$emit('ssoEvent', { name: 'toggleAuthModal', data: true });
+		},
+		async submit() {
+			let data = {
+				otpToken: this.otpToken,
+				otpSecret: this.otpSecret,
+				enable: this.mfaEnable
+			};
 
-      if (!this.mfaEnable) {
-        delete data.otpSecret;
-      }
+			if (!this.mfaEnable) {
+				delete data.otpSecret;
+			}
 
-      this.loading = true;
-      const [err, response] = await to(AuthService.setMfa(data, this.$storex))
-      this.loading = false;
-      if (err) {
-        EventBus.$emit('ssoEvent', {name: 'setLoading', data: false})
-        return this.errorHandler(err)
-      }
-      if (response.data.success) {
-        this.getAccountSettings();
-        this.successSnack(response.data.message);
-      }
-    },
-  }
+			this.loading = true;
+			const [err, response] = await to(AuthService.setMfa(data, this.$storex));
+			this.loading = false;
+			if (err) {
+				EventBus.$emit('ssoEvent', { name: 'setLoading', data: false });
+				return this.errorHandler(err);
+			}
+			if (response.data.success) {
+				this.getAccountSettings();
+				this.successSnack(response.data.message);
+			}
+		}
+	}
 };
 </script>
 

package/src/views/QR.vue

@@ -1,38 +1,35 @@
 <template>
-    <div class="page-login content-boxed content-boxed-padding">
-        <h5 style="text-align: center; width: 80%; margin: 0 auto; margin-top: 130px;">
-            {{ ssoLang[appLanguage].use_tapni_on_the_web }}
-        </h5>
-        <br>
+	<div class="page-login content-boxed content-boxed-padding">
+		<h5 style="text-align: center; width: 80%; margin: 0 auto; margin-top: 130px">
+			{{ ssoLang[appLanguage].use_tapni_on_the_web }}
+		</h5>
+		<br />
 
-        <div class="qrCodeLoginContainer center-text">
-            <div id="qrCodeContainer"
-                 class="qrCodeRounded"
-                 style="max-width: 100%;"/>
-            <br>
-            <br>
-            <div style="margin: 0 auto; width: 85%; text-align: left;">
-                <h2 class="center-text">{{ ssoLang[appLanguage].login_by_scanning_qr_code }}</h2>
-                <br>
-                <h4>{{ ssoLang[appLanguage].open_tapni_app_on_your_phone }}</h4>
-                <h4>{{ ssoLang[appLanguage].go_to_settings_link_a_device }}</h4>
-                <h4>{{ ssoLang[appLanguage].point_your_phone_at_this_qr_code }}</h4>
-                <br>
-                <br>
-            </div>
-            <router-link to="/login">{{ ssoLang[appLanguage].choose_other_login_methods }}</router-link>
-        </div>
-    </div>
+		<div class="qrCodeLoginContainer center-text">
+			<div id="qrCodeContainer" class="qrCodeRounded" style="max-width: 100%" />
+			<br />
+			<br />
+			<div style="margin: 0 auto; width: 85%; text-align: left">
+				<h2 class="center-text">{{ ssoLang[appLanguage].login_by_scanning_qr_code }}</h2>
+				<br />
+				<h4>{{ ssoLang[appLanguage].open_tapni_app_on_your_phone }}</h4>
+				<h4>{{ ssoLang[appLanguage].go_to_settings_link_a_device }}</h4>
+				<h4>{{ ssoLang[appLanguage].point_your_phone_at_this_qr_code }}</h4>
+				<br />
+				<br />
+			</div>
+			<router-link to="/login">{{ ssoLang[appLanguage].choose_other_login_methods }}</router-link>
+		</div>
+	</div>
 </template>
 
-
 <script>
-import QRAuthMixin from "../mixins/qr-auth.mixin";
-import AuthMixin from "../mixins/auth.mixin";
+import QRAuthMixin from '../mixins/qr-auth.mixin';
+import AuthMixin from '../mixins/auth.mixin';
 
 export default {
-  name: "AuthQR",
-  mixins: [AuthMixin, QRAuthMixin],
+	name: 'AuthQR',
+	mixins: [AuthMixin, QRAuthMixin]
 };
 </script>