|
22 | 22 |
|
23 | 23 | <template> |
24 | 24 | <div> |
25 | | - <NcSelect :value="currentValue" |
| 25 | + <NcSelect :aria-label-combobox="t('workflowengine', 'Select groups')" |
| 26 | + :aria-label-listbox="t('workflowengine', 'Groups')" |
| 27 | + :clearable="false" |
26 | 28 | :loading="status.isLoading && groups.length === 0" |
| 29 | + :placeholder="t('workflowengine', 'Type to search for group …')" |
27 | 30 | :options="groups" |
28 | | - :clearable="false" |
| 31 | + :value="currentValue" |
29 | 32 | label="displayname" |
30 | | - @search-change="searchAsync" |
| 33 | + @search="searchAsync" |
31 | 34 | @input="(value) => $emit('input', value.id)" /> |
32 | 35 | </div> |
33 | 36 | </template> |
34 | 37 |
|
35 | 38 | <script> |
36 | | -import NcSelect from '@nextcloud/vue/dist/Components/NcSelect.js' |
37 | | -import axios from '@nextcloud/axios' |
| 39 | +import { translate as t } from '@nextcloud/l10n' |
38 | 40 | import { generateOcsUrl } from '@nextcloud/router' |
39 | 41 |
|
| 42 | +import axios from '@nextcloud/axios' |
| 43 | +import NcSelect from '@nextcloud/vue/dist/Components/NcSelect.js' |
| 44 | +
|
40 | 45 | const groups = [] |
41 | 46 | const status = { |
42 | 47 | isLoading: false, |
@@ -69,14 +74,18 @@ export default { |
69 | 74 | }, |
70 | 75 | }, |
71 | 76 | async mounted() { |
| 77 | + // If empty, load first chunk of groups |
72 | 78 | if (this.groups.length === 0) { |
73 | 79 | await this.searchAsync('') |
74 | 80 | } |
75 | | - if (this.currentValue === null) { |
| 81 | + // If a current group is set but not in our list of groups then search for that group |
| 82 | + if (this.currentValue === null && this.value) { |
76 | 83 | await this.searchAsync(this.value) |
77 | 84 | } |
78 | 85 | }, |
79 | 86 | methods: { |
| 87 | + t, |
| 88 | +
|
80 | 89 | searchAsync(searchQuery) { |
81 | 90 | if (this.status.isLoading) { |
82 | 91 | return |
|
0 commit comments