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

Merge branch 'feat/user-groups-tab' of github.com:Budibase/budibase into app-overview-access-tab

master
Andrew Kingston 4 years ago
parent
527962b301 6b3832b841
commit
e1063bf0bf
9 changed files with 95 additions and 32 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. 13
      packages/bbui/src/Table/Table.svelte
  2. 2
      packages/builder/src/pages/builder/portal/manage/groups/_components/UserGroupsRow.svelte
  3. 8
      packages/builder/src/pages/builder/portal/manage/groups/index.svelte
  4. 2
      packages/builder/src/pages/builder/portal/manage/users/_components/AppsTableRenderer.svelte
  5. 19
      packages/builder/src/pages/builder/portal/manage/users/_components/GroupsTableRenderer.svelte
  6. 19
      packages/builder/src/pages/builder/portal/manage/users/_components/RoleTableRenderer.svelte
  7. 13
      packages/builder/src/pages/builder/portal/manage/users/_components/SettingsTableRenderer.svelte
  8. 42
      packages/builder/src/pages/builder/portal/manage/users/index.svelte
  9. 9
      packages/builder/src/stores/portal/groups.js

13
packages/bbui/src/Table/Table.svelte
View File

@ -285,7 +285,7 @@
<div class="spectrum-Table-head"> <div class="spectrum-Table-head">
{#if showEditColumn} {#if showEditColumn}
<div <div
class:noBorder={!showHeaderBorder} class:noBorderHeader={!showHeaderBorder}
class="spectrum-Table-headCell spectrum-Table-headCell--divider spectrum-Table-headCell--edit" class="spectrum-Table-headCell spectrum-Table-headCell--divider spectrum-Table-headCell--edit"
> >
{#if allowSelectRows} {#if allowSelectRows}
@ -301,7 +301,7 @@
{#each fields as field} {#each fields as field}
<div <div
class="spectrum-Table-headCell" class="spectrum-Table-headCell"
class:noBorder={!showHeaderBorder} class:noBorderHeader={!showHeaderBorder}
class:spectrum-Table-headCell--alignCenter={schema[field] class:spectrum-Table-headCell--alignCenter={schema[field]
.align === "Center"} .align === "Center"}
class:spectrum-Table-headCell--alignRight={schema[field].align === class:spectrum-Table-headCell--alignRight={schema[field].align ===
@ -353,7 +353,7 @@
> >
{#if showEditColumn} {#if showEditColumn}
<div <div
class:noBorder={!showHeaderBorder} class:noBorderCheckbox={!showHeaderBorder}
class="spectrum-Table-cell spectrum-Table-cell--divider spectrum-Table-cell--edit" class="spectrum-Table-cell spectrum-Table-cell--divider spectrum-Table-cell--edit"
on:click={e => { on:click={e => {
toggleSelectRow(row) toggleSelectRow(row)
@ -482,12 +482,17 @@
border-right: var(--table-border); border-right: var(--table-border);
} }
.noBorder { .noBorderHeader {
border-top: none !important; border-top: none !important;
border-right: none !important; border-right: none !important;
border-left: none !important; border-left: none !important;
} }
.noBorderCheckbox {
border-top: none !important;
border-right: none !important;
}
.spectrum-Table-headCell--alignCenter { .spectrum-Table-headCell--alignCenter {
justify-content: center; justify-content: center;
} }

2
packages/builder/src/pages/builder/portal/manage/groups/_components/UserGroupsRow.svelte
View File

@ -57,7 +57,7 @@
>Manage</Button >Manage</Button
> >
</div> </div>
<div class=""> <div>
<ActionMenu align="right"> <ActionMenu align="right">
<span slot="control"> <span slot="control">
<Icon hoverable name="More" /> <Icon hoverable name="More" />

8
packages/builder/src/pages/builder/portal/manage/groups/index.svelte
View File

@ -16,7 +16,12 @@
import UserGroupsRow from "./_components/UserGroupsRow.svelte" import UserGroupsRow from "./_components/UserGroupsRow.svelte"
let modal let modal
let group = {} let group = {
name: "",
icon: "",
color: "",
users: [],
}
let proPlan = true let proPlan = true
async function deleteGroup(group) { async function deleteGroup(group) {
@ -38,6 +43,7 @@
onMount(async () => { onMount(async () => {
try { try {
await groups.actions.init() await groups.actions.init()
console.log($groups)
} catch (error) { } catch (error) {
notifications.error("Error getting User groups") notifications.error("Error getting User groups")
} }

2
packages/builder/src/pages/builder/portal/manage/users/_components/AppsTableRenderer.svelte
View File

@ -5,7 +5,7 @@
<div class="align"> <div class="align">
<div class="spacing"> <div class="spacing">
<Icon name="User" /> <Icon name="Apps" />
</div> </div>
{#if value?.apps?.length === 0} {#if value?.apps?.length === 0}
<div> <div>

19
packages/builder/src/pages/builder/portal/manage/users/_components/GroupsTableRenderer.svelte
View File

@ -1,20 +1,21 @@
<script> <script>
import { Icon } from "@budibase/bbui" import { Icon, Body } from "@budibase/bbui"
export let value export let value
$: console.log(value)
</script> </script>
<div class="align"> <div class="align">
<div class="spacing"> <div class="spacing">
<Icon name="User" /> <Icon name="User" />
</div> </div>
{#if value?.groups?.length === 0} {#if value.length === 0}
<div> <div>0</div>
<div>No groups</div> {:else if value.length === 1}
<div class="opacity">
<Body size="S">{value[0].name}</Body>
</div> </div>
{:else if value?.groups?.length === 1}
{value.groups[0]?.name}
{:else} {:else}
{parseInt(value?.groups?.length) || 0} {parseInt(value.length) || 0} groups
{/if} {/if}
</div> </div>
@ -23,6 +24,10 @@
display: flex; display: flex;
} }
.opacity {
opacity: 0.7;
}
.spacing { .spacing {
margin-right: var(--spacing-m); margin-right: var(--spacing-m);
} }

19
packages/builder/src/pages/builder/portal/manage/users/_components/RoleTableRenderer.svelte
View File

@ -0,0 +1,19 @@
<script>
import { Select } from "@budibase/bbui"
const options = [
{ label: "App User", value: true },
{ label: "Developer", value: false },
{ label: "Admin", value: false },
]
</script>
<div class="align">
<Select {options} />
</div>
<style>
.align {
display: flex;
}
</style>

13
packages/builder/src/pages/builder/portal/manage/users/_components/SettingsTableRenderer.svelte
View File

@ -0,0 +1,13 @@
<script>
import { Icon, ActionMenu, MenuItem } from "@budibase/bbui"
</script>
<div>
<ActionMenu align="right">
<span slot="control">
<Icon hoverable name="More" />
</span>
<MenuItem icon="Delete">Delete</MenuItem>
<MenuItem icon="Delete">Edit</MenuItem>
</ActionMenu>
</div>

42
packages/builder/src/pages/builder/portal/manage/users/index.svelte
View File

@ -5,27 +5,26 @@
Button, Button,
ButtonGroup, ButtonGroup,
Table, Table,
Label,
Layout, Layout,
Modal, Modal,
Icon, Icon,
notifications, notifications,
} from "@budibase/bbui" } from "@budibase/bbui"
import AddUserModal from "./_components/AddUserModal.svelte"
import BasicOnboardingModal from "./_components/BasicOnboardingModal.svelte" import BasicOnboardingModal from "./_components/BasicOnboardingModal.svelte"
import { users, groups } from "stores/portal" import { users, groups } from "stores/portal"
import { onMount } from "svelte" import { onMount } from "svelte"
import GroupsTableRenderer from "./_components/GroupsTableRenderer.svelte" import GroupsTableRenderer from "./_components/GroupsTableRenderer.svelte"
import AppsTableRenderer from "./_components/AppsTableRenderer.svelte" import AppsTableRenderer from "./_components/AppsTableRenderer.svelte"
import NameTableRenderer from "./_components/NameTableRenderer.svelte" import NameTableRenderer from "./_components/NameTableRenderer.svelte"
import SettingsTableRenderer from "./_components/SettingsTableRenderer.svelte"
const schema = { const schema = {
name: {}, name: {},
email: {}, email: {},
role: {}, role: {},
userGroup: { displayName: "User group" }, userGroups: { displayName: "User groups" },
apps: {}, apps: {},
settings: { displayName: "" }, settings: { width: "50px", displayName: "", align: "Right" },
// access: {}, // access: {},
// group: {} // group: {}
} }
@ -57,10 +56,25 @@
adminAccess: !!user.admin?.global, adminAccess: !!user.admin?.global,
})) }))
let createUserModal $: enrichedUsers = $users.map(user => {
let basicOnboardingModal let userGroups = []
$groups.forEach(group => {
if (group.users) {
group.users?.forEach(y => {
if (y._id === user._id) {
userGroups.push(group)
}
})
}
})
return {
...user,
userGroups,
}
})
function openBasicOnboardingModal() { let createUserModal
let basicOnboardingModal = function openBasicOnboardingModal() {
createUserModal.hide() createUserModal.hide()
basicOnboardingModal.show() basicOnboardingModal.show()
} }
@ -103,23 +117,21 @@
</ButtonGroup> </ButtonGroup>
<Table <Table
{schema} {schema}
data={filteredUsers || $users} data={enrichedUsers}
allowEditColumns={false} allowEditColumns={false}
allowEditRows={false} allowEditRows={false}
allowSelectRows={true} allowSelectRows={false}
showHeaderBorder={false} showHeaderBorder={false}
customRenderers={[ customRenderers={[
{ column: "userGroup", component: GroupsTableRenderer }, { column: "userGroups", component: GroupsTableRenderer },
{ column: "apps", component: AppsTableRenderer }, { column: "apps", component: AppsTableRenderer },
{ column: "name", component: NameTableRenderer }, { column: "name", component: NameTableRenderer },
{ column: "settings", component: SettingsTableRenderer },
]} ]}
/> />
</Layout> </Layout>
</Layout> </Layout>
<Modal bind:this={createUserModal}>
<AddUserModal on:change={openBasicOnboardingModal} />
</Modal>
<Modal bind:this={basicOnboardingModal}><BasicOnboardingModal {email} /></Modal> <Modal bind:this={basicOnboardingModal}><BasicOnboardingModal {email} /></Modal>
<style> <style>
@ -132,8 +144,4 @@
.access-text { .access-text {
margin-left: var(--spacing-m); margin-left: var(--spacing-m);
} }
.field > :global(*) + :global(*) {
margin-left: var(--spacing-m);
}
</style> </style>

9
packages/builder/src/stores/portal/groups.js
View File

@ -2,7 +2,14 @@ import { writable } from "svelte/store"
import { API } from "api" import { API } from "api"
export function createGroupsStore() { export function createGroupsStore() {
const store = writable([]) const DEFAULT_CONFIG = {
name: "",
icon: "",
color: "",
users: [],
}
const store = writable([DEFAULT_CONFIG])
const actions = { const actions = {
init: async () => { init: async () => {

Write Preview
Loading…
Cancel
Save