Add user edit/new dialog
This commit is contained in:
@@ -8,6 +8,7 @@ import { ref, onMounted, computed, useTemplateRef } from 'vue';
|
||||
import { Button, ButtonGroup, TextInput, Dropdown, TableView, InputDialog } from 'pankow';
|
||||
import { ROLES } from '../constants.js';
|
||||
import Section from '../components/Section.vue';
|
||||
import UserDialog from '../components/UserDialog.vue';
|
||||
import GroupDialog from '../components/GroupDialog.vue';
|
||||
import ImpersonateDialog from '../components/ImpersonateDialog.vue';
|
||||
import PasswordResetDialog from '../components/PasswordResetDialog.vue';
|
||||
@@ -49,6 +50,7 @@ const groupsById = ref({});
|
||||
const roles = ref([]);
|
||||
|
||||
const inputDialog = useTemplateRef('inputDialog');
|
||||
const userDialog = useTemplateRef('userDialog');
|
||||
const groupDialog = useTemplateRef('groupDialog');
|
||||
const impersonateDialog = useTemplateRef('impersonateDialog');
|
||||
const passwordResetDialog = useTemplateRef('passwordResetDialog');
|
||||
@@ -125,6 +127,10 @@ function onPasswordReset(user) {
|
||||
passwordResetDialog.value.open(user);
|
||||
}
|
||||
|
||||
function onEditOrAddUser(user = null) {
|
||||
userDialog.value.open(user);
|
||||
}
|
||||
|
||||
function onEditOrAddGroup(group = null) {
|
||||
groupDialog.value.open(group);
|
||||
}
|
||||
@@ -188,6 +194,7 @@ onMounted(async () => {
|
||||
|
||||
<template>
|
||||
<InputDialog ref="inputDialog" />
|
||||
<UserDialog ref="userDialog" @success="refreshUsers()"/>
|
||||
<GroupDialog ref="groupDialog" @success="refreshGroups()"/>
|
||||
<ImpersonateDialog ref="impersonateDialog" />
|
||||
<PasswordResetDialog ref="passwordResetDialog" />
|
||||
@@ -197,10 +204,10 @@ onMounted(async () => {
|
||||
<template #header-buttons>
|
||||
<TextInput v-model="search" placeholder="Search ..." />
|
||||
<Dropdown outline tool :options="filterOptions" option-key="id" option-label="name" v-model="filter"></Dropdown>
|
||||
<Button icon="fa-solid fa-user-plus">{{ $t('users.newUserAction') }}</Button>
|
||||
<Button icon="fa-solid fa-user-plus" @click="onEditOrAddUser()">{{ $t('users.newUserAction') }}</Button>
|
||||
</template>
|
||||
|
||||
<TableView :columns="usersColumns" :model="filteredUsers" :busy="busy" style="max-height: 400px;">
|
||||
<TableView :columns="usersColumns" :model="filteredUsers" :busy="busy" style="max-height: 400px;" @row-click="onEditOrAddUser">
|
||||
<template #role="user">
|
||||
<i class="fas fa-crown arrow" v-if="user.active && user.role === 'owner'" v-tooltip="$t('users.users.superadminTooltip')"></i>
|
||||
<i class="fa fa-user-tie arrow" v-if="user.active && user.role === 'admin'" v-tooltip="$t('users.users.adminTooltip')"></i>
|
||||
@@ -222,7 +229,7 @@ onMounted(async () => {
|
||||
<Button small tool secondary :disabled="!canEdit(user)" v-if="!user.inviteAccepted && !isMe(user) && !user.source" @click="invitation.show(user)" v-tooltip="$t('users.users.invitationTooltip')" icon="fa-solid fa-paper-plane" />
|
||||
<Button small tool secondary :disabled="!canEdit(user)" v-if="user.inviteAccepted && !user.source" @click="onPasswordReset(user)" v-tooltip="$t('users.users.resetPasswordTooltip')" icon="fa-solid fa-key" />
|
||||
<Button small tool secondary :disabled="!canImpersonate(user)" @click="onImpersonate(user)" v-tooltip="$t('users.users.setGhostTooltip')" icon="fa-solid fa-user-secret" />
|
||||
<Button small tool secondary :disabled="!canEdit(user)" @click="userEdit.show(user)" v-tooltip="$t('users.users.editUserTooltip')" icon="fa fa-pencil-alt" />
|
||||
<Button small tool secondary :disabled="!canEdit(user)" @click="onEditOrAddUser(user)" v-tooltip="$t('users.users.editUserTooltip')" icon="fa fa-pencil-alt" />
|
||||
</ButtonGroup>
|
||||
<Button small tool danger :disabled="!canEdit(user) || isMe(user)" @click="onRemoveUser(user)" v-tooltip="$t('users.users.removeUserTooltip')" icon="far fa-trash-alt" />
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user