1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
|
<!--
- SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors
- SPDX-License-Identifier: AGPL-3.0-or-later
-->
<template>
<tr class="header">
<th class="header__cell header__cell--avatar"
data-cy-user-list-header-avatar
scope="col">
<span class="hidden-visually">
{{ t('settings', 'Avatar') }}
</span>
</th>
<th class="header__cell header__cell--displayname"
data-cy-user-list-header-displayname
scope="col">
<strong>
{{ t('settings', 'Display name') }}
</strong>
</th>
<th class="header__cell header__cell--username"
data-cy-user-list-header-username
scope="col">
<span>
{{ t('settings', 'Account name') }}
</span>
</th>
<th class="header__cell"
:class="{ 'header__cell--obfuscated': hasObfuscated }"
data-cy-user-list-header-password
scope="col">
<span>{{ passwordLabel }}</span>
</th>
<th class="header__cell"
data-cy-user-list-header-email
scope="col">
<span>{{ t('settings', 'Email') }}</span>
</th>
<th class="header__cell header__cell--large"
data-cy-user-list-header-groups
scope="col">
<span>{{ t('settings', 'Groups') }}</span>
</th>
<th v-if="subAdminsGroups.length > 0 && (settings.isAdmin || settings.isDelegatedAdmin)"
class="header__cell header__cell--large"
data-cy-user-list-header-subadmins
scope="col">
<span>{{ t('settings', 'Group admin for') }}</span>
</th>
<th class="header__cell"
data-cy-user-list-header-quota
scope="col">
<span>{{ t('settings', 'Quota') }}</span>
</th>
<th v-if="showConfig.showLanguages"
class="header__cell header__cell--large"
data-cy-user-list-header-languages
scope="col">
<span>{{ t('settings', 'Language') }}</span>
</th>
<th v-if="showConfig.showUserBackend || showConfig.showStoragePath"
class="header__cell header__cell--large"
data-cy-user-list-header-storage-location
scope="col">
<span v-if="showConfig.showUserBackend">
{{ t('settings', 'Account backend') }}
</span>
<span v-if="showConfig.showStoragePath"
class="header__subtitle">
{{ t('settings', 'Storage location') }}
</span>
</th>
<th v-if="showConfig.showLastLogin"
class="header__cell"
data-cy-user-list-header-last-login
scope="col">
<span>{{ t('settings', 'Last login') }}</span>
</th>
<th class="header__cell header__cell--large header__cell--fill"
data-cy-user-list-header-manager
scope="col">
<!-- TRANSLATORS This string describes a manager in the context of an organization -->
<span>{{ t('settings', 'Manager') }}</span>
</th>
<th class="header__cell header__cell--actions"
data-cy-user-list-header-actions
scope="col">
<span class="hidden-visually">
{{ t('settings', 'Account actions') }}
</span>
</th>
</tr>
</template>
<script lang="ts">
import Vue from 'vue'
import { translate as t } from '@nextcloud/l10n'
export default Vue.extend({
name: 'UserListHeader',
props: {
hasObfuscated: {
type: Boolean,
required: true,
},
},
computed: {
showConfig() {
// @ts-expect-error: allow untyped $store
return this.$store.getters.getShowConfig
},
settings() {
// @ts-expect-error: allow untyped $store
return this.$store.getters.getServerData
},
subAdminsGroups() {
// @ts-expect-error: allow untyped $store
return this.$store.getters.getSubadminGroups
},
passwordLabel(): string {
if (this.hasObfuscated) {
// TRANSLATORS This string is for a column header labelling either a password or a message that the current user has insufficient permissions
return t('settings', 'Password or insufficient permissions message')
}
return t('settings', 'Password')
},
},
methods: {
t,
},
})
</script>
<style lang="scss" scoped>
@import './shared/styles.scss';
.header {
border-bottom: 1px solid var(--color-border);
@include row;
@include cell;
}
</style>
|
