@@ -69,6 +76,7 @@ import { Fragment } from 'vue-frag'
import NcEmptyContent from '@nextcloud/vue/components/NcEmptyContent'
import NcIconSvgWrapper from '@nextcloud/vue/components/NcIconSvgWrapper'
import NcLoadingIcon from '@nextcloud/vue/components/NcLoadingIcon'
+import EditUserDialog from './Users/EditUserDialog.vue'
import NewUserDialog from './Users/NewUserDialog.vue'
import UserListFooter from './Users/UserListFooter.vue'
import UserListHeader from './Users/UserListHeader.vue'
@@ -78,13 +86,13 @@ import logger from '../logger.ts'
import { defaultQuota, unlimitedQuota } from '../utils/userUtils.ts'
const newUser = Object.freeze({
- id: '',
+ username: '',
displayName: '',
password: '',
- mailAddress: '',
+ email: '',
groups: [],
manager: '',
- subAdminsGroups: [],
+ subadminGroups: [],
quota: defaultQuota,
language: {
code: 'en',
@@ -96,6 +104,7 @@ export default {
name: 'UserList',
components: {
+ EditUserDialog,
Fragment,
NcEmptyContent,
NcIconSvgWrapper,
@@ -137,6 +146,7 @@ export default {
},
newUser: { ...newUser },
+ editingUser: null,
isInitialLoad: true,
}
},
@@ -267,6 +277,10 @@ export default {
},
methods: {
+ openEditDialog(user) {
+ this.editingUser = user
+ },
+
async handleScrollEnd() {
await this.loadUsers()
},
diff --git a/apps/settings/src/components/Users/EditUserDialog.vue b/apps/settings/src/components/Users/EditUserDialog.vue
new file mode 100644
index 00000000000..7e69ea3bcd2
--- /dev/null
+++ b/apps/settings/src/components/Users/EditUserDialog.vue
@@ -0,0 +1,278 @@
+
+
+
+
+
+
+
+
+ {{ saving ? t('settings', 'Saving\u00A0…') : t('settings', 'Save') }}
+
+
+
+
+
+
+
+
diff --git a/apps/settings/src/components/Users/NewUserDialog.vue b/apps/settings/src/components/Users/NewUserDialog.vue
index 10def24eec5..c568db15c9f 100644
--- a/apps/settings/src/components/Users/NewUserDialog.vue
+++ b/apps/settings/src/components/Users/NewUserDialog.vue
@@ -16,128 +16,11 @@
data-test="form"
:disabled="loading.all"
@submit.prevent="createUser">
-
-
-
- {{ t('settings', 'Either password or email is required') }}
-
-
-
-
- addGroup(options.at(-1))" />
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
@@ -154,14 +37,9 @@
@@ -416,38 +156,7 @@ export default {
diff --git a/apps/settings/src/components/Users/UserFormGroups.vue b/apps/settings/src/components/Users/UserFormGroups.vue
new file mode 100644
index 00000000000..db7d5bac6aa
--- /dev/null
+++ b/apps/settings/src/components/Users/UserFormGroups.vue
@@ -0,0 +1,129 @@
+
+
+
+
+
+
+
diff --git a/apps/settings/src/components/Users/UserFormLanguage.vue b/apps/settings/src/components/Users/UserFormLanguage.vue
new file mode 100644
index 00000000000..271f038eff8
--- /dev/null
+++ b/apps/settings/src/components/Users/UserFormLanguage.vue
@@ -0,0 +1,65 @@
+
+
+
+
+
+
+
+
+
diff --git a/apps/settings/src/components/Users/UserFormManager.vue b/apps/settings/src/components/Users/UserFormManager.vue
new file mode 100644
index 00000000000..e4f64ace01e
--- /dev/null
+++ b/apps/settings/src/components/Users/UserFormManager.vue
@@ -0,0 +1,71 @@
+
+
+
+
+
+
+
+
+
diff --git a/apps/settings/src/components/Users/UserFormQuota.vue b/apps/settings/src/components/Users/UserFormQuota.vue
new file mode 100644
index 00000000000..703b1b7565b
--- /dev/null
+++ b/apps/settings/src/components/Users/UserFormQuota.vue
@@ -0,0 +1,53 @@
+
+
+
+
+
+
+
+
+
diff --git a/apps/settings/src/components/Users/UserRow.vue b/apps/settings/src/components/Users/UserRow.vue
index b85680acdea..f867005916f 100644
--- a/apps/settings/src/components/Users/UserRow.vue
+++ b/apps/settings/src/components/Users/UserRow.vue
@@ -20,26 +20,8 @@
-
-
-
{{ user.displayname }}
@@ -50,61 +32,16 @@
|
-
-
-
{{ user.email }}
|
-
-
- addUserGroup(options.at(-1))"
- @option:deselected="removeUserGroup" />
-
{{ userGroupsLabels }}
@@ -114,60 +51,15 @@
v-if="settings.isAdmin || settings.isDelegatedAdmin"
data-cy-user-list-cell-subadmins
class="row__cell row__cell--large row__cell--multiline">
-
-
- addUserSubAdmin(options.at(-1))" />
-
{{ userSubAdminGroupsLabels }}
|
-
-
-
-
-
+
{{ userQuota }} ({{ usedSpace }})
-
-
-
-
-
+
{{ userLanguage.name }}
|
@@ -240,31 +111,7 @@
-
-
-
-
-
+
{{ user.manager }}
|
@@ -274,7 +121,6 @@
v-if="visible && !isObfuscated && canEdit && !loading.all"
:actions="userActions"
:disabled="isLoadingField"
- :edit="editing"
:user="user"
@update:edit="toggleEdit" />
@@ -283,19 +129,15 @@
@@ -987,11 +415,6 @@ export default {
background-color: var(--color-background-hover);
}
}
-
- // Limit width of select in fill cell
- .select--fill {
- max-width: calc(var(--cell-width-large) - (2 * var(--cell-padding)));
- }
}
.row {
@@ -999,12 +422,6 @@ export default {
&__cell {
border-bottom: 1px solid var(--color-border);
-
- :deep {
- .v-select.select {
- min-width: var(--cell-min-width);
- }
- }
}
&__progress {
diff --git a/apps/settings/src/components/Users/UserRowActions.vue b/apps/settings/src/components/Users/UserRowActions.vue
index f363551584b..b905d71acb0 100644
--- a/apps/settings/src/components/Users/UserRowActions.vue
+++ b/apps/settings/src/components/Users/UserRowActions.vue
@@ -9,12 +9,12 @@
:disabled="disabled"
:inline="1">
- {{ edit ? t('settings', 'Done') : t('settings', 'Edit') }}
+ @click="$emit('update:edit', true)">
+ {{ t('settings', 'Edit') }}
-
+
import type { PropType } from 'vue'
-import SvgCheck from '@mdi/svg/svg/check.svg?raw'
import SvgPencil from '@mdi/svg/svg/pencil-outline.svg?raw'
import isSvg from 'is-svg'
import { defineComponent } from 'vue'
@@ -59,50 +58,27 @@ export default defineComponent({
},
props: {
- /**
- * Array of user actions
- */
actions: {
type: Array as PropType,
required: true,
},
- /**
- * The state whether the row is currently disabled
- */
disabled: {
type: Boolean,
required: true,
},
- /**
- * The state whether the row is currently edited
- */
- edit: {
- type: Boolean,
- required: true,
- },
-
- /**
- * Target of this actions
- */
user: {
type: Object,
required: true,
},
},
- computed: {
- /**
- * Current MDI logo to show for edit toggle
- */
- editSvg(): string {
- return this.edit ? SvgCheck : SvgPencil
- },
+ setup() {
+ return { SvgPencil }
+ },
- /**
- * Enabled user row actions
- */
+ computed: {
enabledActions(): UserAction[] {
return this.actions.filter((action) => typeof action.enabled === 'function' ? action.enabled(this.user) : true)
},
@@ -110,13 +86,6 @@ export default defineComponent({
methods: {
isSvg,
-
- /**
- * Toggle edit mode by emitting the update event
- */
- toggleEdit() {
- this.$emit('update:edit', !this.edit)
- },
},
})
diff --git a/apps/settings/src/mixins/UserRowMixin.js b/apps/settings/src/mixins/UserRowMixin.js
index 9e53ccd6072..d4b74fd18a3 100644
--- a/apps/settings/src/mixins/UserRowMixin.js
+++ b/apps/settings/src/mixins/UserRowMixin.js
@@ -3,7 +3,6 @@
* SPDX-License-Identifier: AGPL-3.0-or-later
*/
-import { formatFileSize } from '@nextcloud/files'
import { useFormatDateTime } from '@nextcloud/vue'
export default {
@@ -16,10 +15,6 @@ export default {
type: Object,
default: () => ({}),
},
- quotaOptions: {
- type: Array,
- default: () => [],
- },
languages: {
type: Array,
required: true,
@@ -42,47 +37,18 @@ export default {
}
},
computed: {
- showConfig() {
- return this.$store.getters.getShowConfig
- },
-
- /* QUOTA MANAGEMENT */
- usedSpace() {
- const quotaUsed = this.user.quota.used > 0 ? this.user.quota.used : 0
- return t('settings', '{size} used', { size: formatFileSize(quotaUsed, true) })
- },
-
usedQuota() {
let quota = this.user.quota.quota
if (quota > 0) {
quota = Math.min(100, Math.round(this.user.quota.used / quota * 100))
} else {
const usedInGB = this.user.quota.used / (10 * Math.pow(2, 30))
- // asymptotic curve approaching 50% at 10GB to visualize used stace with infinite quota
+ // asymptotic curve approaching 50% at 10GB to visualize used space with infinite quota
quota = 95 * (1 - (1 / (usedInGB + 1)))
}
return isNaN(quota) ? 0 : quota
},
- // Mapping saved values to objects
- userQuota() {
- if (this.user.quota.quota >= 0) {
- // if value is valid, let's map the quotaOptions or return custom quota
- const humanQuota = formatFileSize(this.user.quota.quota)
- const userQuota = this.quotaOptions.find((quota) => quota.id === humanQuota)
- return userQuota || { id: humanQuota, label: humanQuota }
- } else if (this.user.quota.quota === 'default') {
- // default quota is replaced by the proper value on load
- return this.quotaOptions[0]
- }
- return this.quotaOptions[1] // unlimited
- },
-
- /* PASSWORD POLICY? */
- minPasswordLength() {
- return this.$store.getters.getPasswordPolicyMinLength
- },
-
/* LANGUAGE */
userLanguage() {
const availableLanguages = this.languages[0].languages.concat(this.languages[1].languages)
@@ -121,19 +87,5 @@ export default {
}
return t('settings', 'Never')
},
-
- userGroups() {
- const allGroups = this.$store.getters.getGroups
- return this.user.groups
- .map((id) => allGroups.find((g) => g.id === id))
- .filter((group) => group !== undefined)
- },
-
- userSubAdminGroups() {
- const allGroups = this.$store.getters.getGroups
- return this.user.subadmin
- .map((id) => allGroups.find((g) => g.id === id))
- .filter((group) => group !== undefined)
- },
},
}