optimize ui
This commit is contained in:
@@ -2,7 +2,12 @@
|
||||
<f7-page>
|
||||
<f7-navbar :title="$t('Device & Sessions')" :back-link="$t('Back')"></f7-navbar>
|
||||
|
||||
<f7-list media-list>
|
||||
<f7-list media-list class="skeleton-text" v-if="loading">
|
||||
<f7-list-item title="Token Name" after="MM/DD/YYYY HH:mm:ss"
|
||||
text="Mozilla/5.0 (OS Name & Version or Device Name; CPU Architecture ...) AppleWebKit/Version (KHTML, like Gecko) Software Name/Version Software Name/Version ..."></f7-list-item>
|
||||
</f7-list>
|
||||
|
||||
<f7-list media-list v-else-if="!loading">
|
||||
<f7-list-item swipeout v-for="token in tokens" :key="token.tokenId" :id="token | tokenDomId" :title="token | tokenTitle | t" :after="token.createdAt | moment($t('format.datetime.long'))" :text="token.userAgent">
|
||||
<f7-swipeout-actions right v-if="!token.isCurrent" >
|
||||
<f7-swipeout-button color="red" :text="$t('Log Out')" @click="revoke(token)"></f7-swipeout-button>
|
||||
@@ -16,17 +21,18 @@
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
tokens: []
|
||||
tokens: [],
|
||||
loading: true
|
||||
};
|
||||
},
|
||||
created() {
|
||||
const self = this;
|
||||
const router = self.$f7router;
|
||||
|
||||
self.$showLoading();
|
||||
self.loading = true;
|
||||
|
||||
self.$services.getTokens().then(response => {
|
||||
self.$hideLoading();
|
||||
self.loading = false;
|
||||
const data = response.data;
|
||||
|
||||
if (!data || !data.success || !data.result) {
|
||||
@@ -38,7 +44,7 @@ export default {
|
||||
|
||||
self.tokens = data.result;
|
||||
}).catch(error => {
|
||||
self.$hideLoading();
|
||||
self.loading = false;
|
||||
|
||||
if (error.response && error.response.data && error.response.data.errorMessage) {
|
||||
self.$alert({ error: error.response.data }, () => {
|
||||
|
||||
@@ -2,13 +2,18 @@
|
||||
<f7-page>
|
||||
<f7-navbar :title="$t('Two-Factor Authentication')" :back-link="$t('Back')"></f7-navbar>
|
||||
|
||||
<f7-list v-if="status === true">
|
||||
<f7-list v-if="loading" class="skeleton-text">
|
||||
<f7-list-item title="Status" after="Unknwon"></f7-list-item>
|
||||
<f7-list-button class="disabled">Operate</f7-list-button>
|
||||
</f7-list>
|
||||
|
||||
<f7-list v-else-if="!loading && status === true">
|
||||
<f7-list-item :title="$t('Status')" :after="$t('Enabled')"></f7-list-item>
|
||||
<f7-list-button :class="{ 'disabled': regenerating }" @click="regenerateBackupCode(null)">{{ $t('Regenerate Backup Codes') }}</f7-list-button>
|
||||
<f7-list-button :class="{ 'disabled': disabling }" @click="disable(null)">{{ $t('Disable') }}</f7-list-button>
|
||||
</f7-list>
|
||||
|
||||
<f7-list v-else-if="status === false">
|
||||
<f7-list v-else-if="!loading && status === false">
|
||||
<f7-list-item :title="$t('Status')" :after="$t('Disabled')"></f7-list-item>
|
||||
<f7-list-button :class="{ 'disabled': enabling }" @click="enable">{{ $t('Enable') }}</f7-list-button>
|
||||
</f7-list>
|
||||
@@ -129,6 +134,7 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
status: null,
|
||||
loading: true,
|
||||
new2FASecret: '',
|
||||
new2FAQRCode: '',
|
||||
currentPasscodeForEnable: '',
|
||||
@@ -149,10 +155,10 @@ export default {
|
||||
const self = this;
|
||||
const router = self.$f7router;
|
||||
|
||||
self.$showLoading();
|
||||
self.loading = true;
|
||||
|
||||
self.$services.get2FAStatus().then(response => {
|
||||
self.$hideLoading();
|
||||
self.loading = false;
|
||||
const data = response.data;
|
||||
|
||||
if (!data || !data.success || !data.result || typeof(data.result.enable) !== 'boolean') {
|
||||
@@ -164,7 +170,7 @@ export default {
|
||||
|
||||
self.status = data.result.enable;
|
||||
}).catch(error => {
|
||||
self.$hideLoading();
|
||||
self.loading = false;
|
||||
|
||||
if (error.response && error.response.data && error.response.data.errorMessage) {
|
||||
self.$alert({ error: error.response.data }, () => {
|
||||
|
||||
@@ -1,7 +1,15 @@
|
||||
<template>
|
||||
<f7-page>
|
||||
<f7-navbar :title="$t('User Profile')" :back-link="$t('Back')"></f7-navbar>
|
||||
<f7-list no-hairlines-md>
|
||||
|
||||
<f7-list no-hairlines-md class="skeleton-text" v-if="loading">
|
||||
<f7-list-input label="Password" placeholder="Your password"></f7-list-input>
|
||||
<f7-list-input label="Confirmation Password" placeholder="Re-enter the password"></f7-list-input>
|
||||
<f7-list-input label="E-mail" placeholder="Your email address"></f7-list-input>
|
||||
<f7-list-input label="Nickname" placeholder="Your nickname"></f7-list-input>
|
||||
</f7-list>
|
||||
|
||||
<f7-list no-hairlines-md v-else-if="!loading">
|
||||
<f7-list-input
|
||||
type="password"
|
||||
clear-button
|
||||
@@ -81,6 +89,7 @@ export default {
|
||||
email: '',
|
||||
oldNickname: '',
|
||||
nickname: '',
|
||||
loading: true,
|
||||
updating: false,
|
||||
showInputPasswordSheet: false
|
||||
};
|
||||
@@ -117,10 +126,10 @@ export default {
|
||||
const self = this;
|
||||
const router = self.$f7router;
|
||||
|
||||
self.$showLoading();
|
||||
self.loading = true;
|
||||
|
||||
self.$services.getProfile().then(response => {
|
||||
self.$hideLoading();
|
||||
self.loading = false;
|
||||
const data = response.data;
|
||||
|
||||
if (!data || !data.success || !data.result) {
|
||||
@@ -136,7 +145,7 @@ export default {
|
||||
self.email = self.oldEmail
|
||||
self.nickname = self.oldNickname;
|
||||
}).catch(error => {
|
||||
self.$hideLoading();
|
||||
self.loading = false;
|
||||
|
||||
if (error.response && error.response.data && error.response.data.errorMessage) {
|
||||
self.$alert({ error: error.response.data }, () => {
|
||||
|
||||
Reference in New Issue
Block a user