adds separate Basic Onboarding modal
This commit is contained in:
parent
d4d8506fd5
commit
cb78e68d99
|
@ -1,5 +1,11 @@
|
|||
<script>
|
||||
import { Body, Input, Select, ModalContent } from "@budibase/bbui"
|
||||
import { createEventDispatcher } from "svelte"
|
||||
|
||||
const dispatch = createEventDispatcher()
|
||||
const onChange = ({ detail }) => {
|
||||
if (detail === options[1]) dispatch("basic")
|
||||
}
|
||||
|
||||
const options = ["Email onboarding", "Basic onboarding"]
|
||||
let selected = options[0]
|
||||
|
@ -17,6 +23,12 @@
|
|||
automated email onboarding flow. Otherwise, use our basic onboarding process
|
||||
with autogenerated passwords.</Body
|
||||
>
|
||||
<Select bind:value={selected} label="Add new user via:" {options} />
|
||||
<Select
|
||||
placeholder=""
|
||||
bind:value={selected}
|
||||
on:change={onChange}
|
||||
{options}
|
||||
label="Add new user via:"
|
||||
/>
|
||||
<Input label="Email" />
|
||||
</ModalContent>
|
||||
|
|
|
@ -0,0 +1,21 @@
|
|||
<script>
|
||||
import { ModalContent, Body, Input, ActionButton } from "@budibase/bbui"
|
||||
</script>
|
||||
|
||||
<ModalContent
|
||||
size="M"
|
||||
title="Basic user onboarding"
|
||||
confirmText="Continue"
|
||||
cancelText="Cancel"
|
||||
showCloseIcon={false}
|
||||
>
|
||||
<Body noPadding
|
||||
>Below you will find the user’s username and password. The password will not
|
||||
be accessible from this point. Please download the credentials.</Body
|
||||
>
|
||||
<Input disabled label="Username" value="joebudibase" />
|
||||
<Input disabled label="Password" value="kjhfweiufqohy87t23" />
|
||||
<div class="download">
|
||||
<ActionButton icon="Download">Download user credentials</ActionButton>
|
||||
</div>
|
||||
</ModalContent>
|
|
@ -10,9 +10,9 @@
|
|||
Label,
|
||||
Layout,
|
||||
Modal,
|
||||
ModalContent,
|
||||
} from "@budibase/bbui"
|
||||
import AddUserModal from "./_components/AddUserModal.svelte"
|
||||
import BasicOnboardingModal from "./_components/BasicOnboardingModal.svelte"
|
||||
import { users } from "stores/portal"
|
||||
|
||||
users.init()
|
||||
|
@ -27,7 +27,13 @@
|
|||
let search
|
||||
$: filteredUsers = $users.filter(user => user.email.includes(search || ""))
|
||||
|
||||
export let modal
|
||||
let userModal
|
||||
let basicOnboardingModal
|
||||
|
||||
function openBasicOnboardingModal() {
|
||||
userModal.hide()
|
||||
basicOnboardingModal.show()
|
||||
}
|
||||
</script>
|
||||
|
||||
<Layout>
|
||||
|
@ -49,8 +55,8 @@
|
|||
</div>
|
||||
<div class="buttons">
|
||||
<ButtonGroup>
|
||||
<Button tooltip="Coming soon." disabled secondary>Import users</Button>
|
||||
<Button overBackground on:click={modal.show}>Add user</Button>
|
||||
<Button disabled secondary>Import users</Button>
|
||||
<Button overBackground on:click={userModal.show}>Add user</Button>
|
||||
</ButtonGroup>
|
||||
</div>
|
||||
<Table
|
||||
|
@ -63,7 +69,10 @@
|
|||
</div>
|
||||
</Layout>
|
||||
|
||||
<Modal bind:this={modal}><AddUserModal /></Modal>
|
||||
<Modal bind:this={userModal}
|
||||
><AddUserModal on:basic={openBasicOnboardingModal} /></Modal
|
||||
>
|
||||
<Modal bind:this={basicOnboardingModal}><BasicOnboardingModal /></Modal>
|
||||
|
||||
<style>
|
||||
.users {
|
||||
|
|
Loading…
Reference in New Issue