2fa page retheme
This commit is contained in:
parent
5fe6a5766a
commit
fdc4e2cf10
|
@ -65,7 +65,10 @@
|
||||||
"title": "Authenticate with TOTP",
|
"title": "Authenticate with TOTP",
|
||||||
"subtitle": "Enter the 6-digit code displayed in your authenticator app",
|
"subtitle": "Enter the 6-digit code displayed in your authenticator app",
|
||||||
"label": "TOTP Code",
|
"label": "TOTP Code",
|
||||||
"button": "Verify"
|
"button": "Verify",
|
||||||
|
"error": {
|
||||||
|
"ERR_UNAUTHORIZED": "Invalid 2FA code"
|
||||||
|
}
|
||||||
},
|
},
|
||||||
"networkcreate": {
|
"networkcreate": {
|
||||||
"title": "Create your network",
|
"title": "Create your network",
|
||||||
|
|
|
@ -10,7 +10,7 @@
|
||||||
let loading = true;
|
let loading = true;
|
||||||
let isError = false;
|
let isError = false;
|
||||||
let error = '';
|
let error = '';
|
||||||
$: currentlyLoading = $isLoading || loading;
|
$: currentlyLoading = $isLoading;
|
||||||
|
|
||||||
logSetup();
|
logSetup();
|
||||||
let logger = new Logger("2fa/+page.svelte");
|
let logger = new Logger("2fa/+page.svelte");
|
||||||
|
@ -43,7 +43,6 @@
|
||||||
|
|
||||||
if (create_res[0] == APIResult.Failed) {
|
if (create_res[0] == APIResult.Failed) {
|
||||||
logger.error(`totp auth fail`);
|
logger.error(`totp auth fail`);
|
||||||
isError = true;
|
|
||||||
let err = create_res[1] as APIError;
|
let err = create_res[1] as APIError;
|
||||||
|
|
||||||
let etext = err.code;
|
let etext = err.code;
|
||||||
|
@ -55,7 +54,8 @@
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
error = $t('2fasetup.error.generic', {values:{err:etext}});
|
errForm = $t('2fa.error.' + etext);
|
||||||
|
hasErrForm = true;
|
||||||
loading = false;
|
loading = false;
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
@ -71,14 +71,31 @@
|
||||||
</svelte:head>
|
</svelte:head>
|
||||||
|
|
||||||
<LoadingWrapper isLoading={currentlyLoading} isError={isError} error={error}>
|
<LoadingWrapper isLoading={currentlyLoading} isError={isError} error={error}>
|
||||||
<h1>{$t('2fa.title')}</h1>
|
|
||||||
<h3>{$t('2fa.subtitle')}</h3>
|
<div class="h-100 d-flex align-items-center justify-content-center">
|
||||||
|
<div class="card w-25">
|
||||||
|
<div class="card-body">
|
||||||
|
<h4 class="card-title">{$t('2fa.title')}</h4>
|
||||||
|
<p class="card-text">{$t('2fa.subtitle')}</p>
|
||||||
|
|
||||||
<form on:submit|preventDefault={onSubmit}>
|
<form on:submit|preventDefault={onSubmit}>
|
||||||
<label for="mfacode">{$t('2fa.label')}</label>
|
<label class="form-label" for="mfacode">{$t('2fa.label')}</label>
|
||||||
<input type="text" bind:value={mfacode} id="mfacode"/>
|
<input placeholder="123456" class="form-control" type="text" bind:value={mfacode} id="mfacode"/>
|
||||||
<button>{$t('2fa.button')}</button>
|
|
||||||
|
{#if loading}
|
||||||
|
<button disabled class="mt-2 w-100 btn btn-primary"><i class="fas fa-gear fa-spin"></i></button>
|
||||||
|
{:else}
|
||||||
|
<button class="mt-2 w-100 btn-primary btn">{$t('2fa.button')}</button>
|
||||||
|
{/if}
|
||||||
|
|
||||||
{#if hasErrForm}
|
{#if hasErrForm}
|
||||||
<p>{errForm}</p>
|
<p class="mt-2 mb-0 text-danger">{errForm}</p>
|
||||||
{/if}
|
{/if}
|
||||||
</form>
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</LoadingWrapper>
|
</LoadingWrapper>
|
||||||
|
|
Loading…
Reference in New Issue