forked from tsai/budibase
20 changed files with 192 additions and 48 deletions
@ -0,0 +1,95 @@ |
|||
<script> |
|||
import { |
|||
ActionButton, |
|||
Body, |
|||
Button, |
|||
Divider, |
|||
Heading, |
|||
Input, |
|||
Layout, |
|||
notifications, |
|||
} from "@budibase/bbui" |
|||
import { goto, params } from "@roxi/routify" |
|||
import { auth, organisation } from "stores/portal" |
|||
import GoogleButton from "./_components/GoogleButton.svelte" |
|||
import Logo from "assets/bb-emblem.svg" |
|||
import { onMount } from "svelte" |
|||
|
|||
let tenantId = "" |
|||
let username = "" |
|||
let password = "" |
|||
|
|||
$: company = $organisation.company || "Budibase" |
|||
|
|||
async function login() { |
|||
try { |
|||
await auth.login({ |
|||
username, |
|||
password, |
|||
tenantId, |
|||
}) |
|||
notifications.success("Logged in successfully") |
|||
if ($auth?.user?.forceResetPassword) { |
|||
$goto("./reset") |
|||
} else { |
|||
if ($params["?returnUrl"]) { |
|||
window.location = decodeURIComponent($params["?returnUrl"]) |
|||
} else { |
|||
notifications.success("Logged in successfully") |
|||
$goto("../portal") |
|||
} |
|||
} |
|||
} catch (err) { |
|||
console.error(err) |
|||
notifications.error("Invalid credentials") |
|||
} |
|||
} |
|||
|
|||
function handleKeydown(evt) { |
|||
if (evt.key === "Enter") login() |
|||
} |
|||
|
|||
onMount(async () => { |
|||
await organisation.init() |
|||
}) |
|||
</script> |
|||
|
|||
<svelte:window on:keydown={handleKeydown} /> |
|||
<div class="login"> |
|||
<div class="main"> |
|||
<Layout> |
|||
<Layout noPadding justifyItems="center"> |
|||
<img alt="logo" src={$organisation.logoUrl || Logo} /> |
|||
<Heading>Sign in to {company}</Heading> |
|||
</Layout> |
|||
<GoogleButton /> |
|||
<Divider noGrid /> |
|||
<Layout gap="XS" noPadding> |
|||
<Body size="S" textAlign="center">Sign in with email</Body> |
|||
<Input label="Organisation" bind:value={tenantId} /> |
|||
</Layout> |
|||
<Layout gap="XS" noPadding> |
|||
<Button cta on:click={login}>Sign in to {company}</Button> |
|||
</Layout> |
|||
</Layout> |
|||
</div> |
|||
</div> |
|||
|
|||
<style> |
|||
.login { |
|||
width: 100%; |
|||
height: 100%; |
|||
display: flex; |
|||
flex-direction: column; |
|||
justify-content: center; |
|||
align-items: center; |
|||
} |
|||
|
|||
.main { |
|||
width: 300px; |
|||
} |
|||
|
|||
img { |
|||
width: 48px; |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue