add close button

Signed-off-by: GretaD <gretadoci@gmail.com>

diff --git a/apps/settings/src/components/UserList.vue b/apps/settings/src/components/UserList.vue
index 4d8070787acd4b88c90aab0527d0dc4656188e78..1dd6521ac29cc3caeb4b0520ea7747deb7c628c7 100644 (file)
--- a/apps/settings/src/components/UserList.vue
+++ b/apps/settings/src/components/UserList.vue
@@ -152,6 +152,13 @@
                                        class="button primary icon-checkmark-white has-tooltip"
                                        type="submit"
                                        value="">
+                               <div class="closeButton">
+                                       <Actions>
+                                               <ActionButton icon="icon-close" @click="onClose">
+                                                       {{ t('settings', 'Close') }}
+                                               </ActionButton>
+                                       </Actions>
+                               </div>
                        </div>
                </form>
                <div id="grid-header"
@@ -235,17 +242,17 @@
 
 <script>
 import userRow from './UserList/UserRow'
-import { Multiselect } from 'nextcloud-vue'
+import { Multiselect, Actions, ActionButton } from 'nextcloud-vue'
 import InfiniteLoading from 'vue-infinite-loading'
 import Vue from 'vue'
 
 const unlimitedQuota = {
        id: 'none',
-       label: t('settings', 'Unlimited'),
+       label: t('settings', 'Unlimited')
 }
 const defaultQuota = {
        id: 'default',
-       label: t('settings', 'Default quota'),
+       label: t('settings', 'Default quota')
 }
 const newUser = {
        id: '',
@@ -257,8 +264,8 @@ const newUser = {
        quota: defaultQuota,
        language: {
                code: 'en',
-               name: t('settings', 'Default language'),
-       },
+               name: t('settings', 'Default language')
+       }
 }
 
 export default {
@@ -267,24 +274,26 @@ export default {
                userRow,
                Multiselect,
                InfiniteLoading,
+               Actions,
+               ActionButton
        },
        props: {
                users: {
                        type: Array,
-                       default: () => [],
+                       default: () => []
                },
                showConfig: {
                        type: Object,
-                       required: true,
+                       required: true
                },
                selectedGroup: {
                        type: String,
-                       default: null,
+                       default: null
                },
                externalActions: {
                        type: Array,
-                       default: () => [],
-               },
+                       default: () => []
+               }
        },
        data() {
                return {
@@ -292,11 +301,11 @@ export default {
                        defaultQuota,
                        loading: {
                                all: false,
-                               groups: false,
+                               groups: false
                        },
                        scrolled: false,
                        searchQuery: '',
-                       newUser: Object.assign({}, newUser),
+                       newUser: Object.assign({}, newUser)
                }
        },
        computed: {
@@ -335,9 +344,9 @@ export default {
                },
                quotaOptions() {
                        // convert the preset array into objects
-                       const quotaPreset = this.settings.quotaPreset.reduce((acc, cur) => acc.concat({
+                       let quotaPreset = this.settings.quotaPreset.reduce((acc, cur) => acc.concat({
                                id: cur,
-                               label: cur,
+                               label: cur
                        }), [])
                        // add default presets
                        quotaPreset.unshift(this.unlimitedQuota)
@@ -362,14 +371,14 @@ export default {
                        return [
                                {
                                        label: t('settings', 'Common languages'),
-                                       languages: this.settings.languages.commonlanguages,
+                                       languages: this.settings.languages.commonlanguages
                                },
                                {
                                        label: t('settings', 'All languages'),
-                                       languages: this.settings.languages.languages,
-                               },
+                                       languages: this.settings.languages.languages
+                               }
                        ]
-               },
+               }
        },
        watch: {
                // watch url change and group select
@@ -393,7 +402,7 @@ export default {
                        } else if (val === 1 && old === 0) {
                                this.$refs.infiniteLoading.stateChanger.loaded()
                        }
-               },
+               }
        },
        mounted() {
                if (!this.settings.canChangePassword) {
@@ -428,7 +437,7 @@ export default {
                 */
                validateQuota(quota) {
                        // only used for new presets sent through @Tag
-                       const validQuota = OC.Util.computerFileSize(quota)
+                       let validQuota = OC.Util.computerFileSize(quota)
                        if (validQuota !== null && validQuota >= 0) {
                                // unify format output
                                quota = OC.Util.humanFileSize(OC.Util.computerFileSize(quota))
@@ -445,7 +454,7 @@ export default {
                                offset: this.usersOffset,
                                limit: this.usersLimit,
                                group: this.selectedGroup !== 'disabled' ? this.selectedGroup : '',
-                               search: this.searchQuery,
+                               search: this.searchQuery
                        })
                                .then((response) => {
                                        response ? $state.loaded() : $state.complete()
@@ -493,7 +502,7 @@ export default {
                                groups: this.newUser.groups.map(group => group.id),
                                subadmin: this.newUser.subAdminsGroups.map(group => group.id),
                                quota: this.newUser.quota.id,
-                               language: this.newUser.language.code,
+                               language: this.newUser.language.code
                        })
                                .then(() => {
                                        this.resetForm()
@@ -516,7 +525,7 @@ export default {
                setNewUserDefaultGroup(value) {
                        if (value && value.length > 0) {
                                // setting new user default group to the current selected one
-                               const currentGroup = this.groups.find(group => group.id === value)
+                               let currentGroup = this.groups.find(group => group.id === value)
                                if (currentGroup) {
                                        this.newUser.groups = [currentGroup]
                                        return
@@ -560,6 +569,9 @@ export default {
                                this.$refs.infiniteLoading.stateChanger.reset()
                        }
                },
-       },
+               onClose() {
+                       this.showConfig.showNewUserForm = false
+               }
+       }
 }
 </script>