ufkc7e3d
/
budibase
forked from tsai/budibase
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Fix stale data in group details page, fix role colour in group app access

master
Andrew Kingston 4 years ago
parent
59e08c5346
commit
451c55ae67
1 changed files with 90 additions and 82 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 172
      packages/builder/src/pages/builder/portal/manage/groups/[groupId].svelte

172
packages/builder/src/pages/builder/portal/manage/groups/[groupId].svelte
View File

@ -18,9 +18,10 @@
import { users, apps, groups } from "stores/portal" import { users, apps, groups } from "stores/portal"
import { onMount } from "svelte" import { onMount } from "svelte"
import { RoleUtils } from "@budibase/frontend-core" import { RoleUtils } from "@budibase/frontend-core"
import { roles } from "../../../../../stores/backend" import { roles } from "stores/backend"
export let groupId export let groupId
let popoverAnchor let popoverAnchor
let popover let popover
let searchTerm = "" let searchTerm = ""
@ -28,6 +29,7 @@
let prevSearch = undefined, let prevSearch = undefined,
search = undefined search = undefined
let pageInfo = createPaginationStore() let pageInfo = createPaginationStore()
let loaded = false
$: page = $pageInfo.page $: page = $pageInfo.page
$: fetchUsers(page, search) $: fetchUsers(page, search)
@ -113,98 +115,104 @@
onMount(async () => { onMount(async () => {
try { try {
await groups.actions.init() await Promise.all([groups.actions.init(), apps.load(), roles.fetch()])
await apps.load() loaded = true
await roles.fetch()
} catch (error) { } catch (error) {
notifications.error("Error fetching User Group data") notifications.error("Error fetching user group data")
} }
}) })
</script> </script>
<Layout noPadding> {#if loaded}
<div> <Layout noPadding>
<ActionButton on:click={() => $goto("../groups")} size="S" icon="ArrowLeft"> <div>
Back <ActionButton
</ActionButton> on:click={() => $goto("../groups")}
</div> size="S"
<div class="header"> icon="ArrowLeft"
<div class="title"> >
<div style="background: {group?.color};" class="circle"> Back
<div> </ActionButton>
<Icon size="M" name={group?.icon} /> </div>
<div class="header">
<div class="title">
<div style="background: {group?.color};" class="circle">
<div>
<Icon size="M" name={group?.icon} />
</div>
</div>
<div class="text-padding">
<Heading>{group?.name}</Heading>
</div> </div>
</div> </div>
<div class="text-padding"> <div bind:this={popoverAnchor}>
<Heading>{group?.name}</Heading> <Button on:click={popover.show()} icon="UserAdd" cta>Add User</Button>
</div> </div>
<Popover align="right" bind:this={popover} anchor={popoverAnchor}>
<UserGroupPicker
key={"email"}
title={"User"}
bind:searchTerm
bind:selected={selectedUsers}
bind:filtered
{addAll}
select={selectUser}
/>
</Popover>
</div> </div>
<div bind:this={popoverAnchor}>
<Button on:click={popover.show()} icon="UserAdd" cta>Add User</Button> <List>
</div> {#if group?.users.length}
<Popover align="right" bind:this={popover} anchor={popoverAnchor}> {#each group.users as user}
<UserGroupPicker <ListItem title={user?.email} avatar
key={"email"} ><Icon
title={"User"} on:click={() => removeUser(user?._id)}
bind:searchTerm hoverable
bind:selected={selectedUsers} size="L"
bind:filtered name="Close"
{addAll} /></ListItem
select={selectUser} >
/> {/each}
</Popover> {:else}
</div> <ListItem icon="UserGroup" title="You have no users in this team" />
{/if}
<List> </List>
{#if group?.users.length} <div
{#each group.users as user} style="flex-direction: column; margin-top: var(--spacing-m)"
<ListItem title={user?.email} avatar class="title"
><Icon >
on:click={() => removeUser(user?._id)} <Heading weight="light" size="XS">Apps</Heading>
hoverable <div style="margin-top: var(--spacing-xs)">
size="L" <Body size="S"
name="Close" >Manage apps that this User group has been assigned to</Body
/></ListItem
> >
{/each} </div>
{:else}
<ListItem icon="UserGroup" title="You have no users in this team" />
{/if}
</List>
<div
style="flex-direction: column; margin-top: var(--spacing-m)"
class="title"
>
<Heading weight="light" size="XS">Apps</Heading>
<div style="margin-top: var(--spacing-xs)">
<Body size="S">Manage apps that this User group has been assigned to</Body
>
</div> </div>
</div>
<List>
<List> {#if groupApps.length}
{#if groupApps.length} {#each groupApps as app}
{#each groupApps as app} <ListItem
<ListItem title={app.name}
title={app.name} icon={app?.icon?.name || "Apps"}
icon={app?.icon?.name || "Apps"} iconBackground={app?.icon?.color || ""}
iconBackground={app?.icon?.color || ""} >
> <div class="title ">
<div class="title "> <StatusLight
<StatusLight square
square color={RoleUtils.getRoleColour(group.roles[`app_${app.appId}`])}
color={RoleUtils.getRoleColour(group.roles[app.appId])} >
> {getRoleLabel(app.appId)}
{getRoleLabel(app.appId)} </StatusLight>
</StatusLight> </div>
</div> </ListItem>
</ListItem> {/each}
{/each} {:else}
{:else} <ListItem icon="UserGroup" title="No apps" />
<ListItem icon="UserGroup" title="No apps" /> {/if}
{/if} </List>
</List> </Layout>
</Layout> {/if}
<style> <style>
.text-padding { .text-padding {

Write Preview
Loading…
Cancel
Save