Merge pull request #22800 from nextcloud/fix/settings-search

Add users and apps inner search and add HeaderMenu cancel
This commit is contained in:
John Molakvoæ 2020-09-14 16:41:29 +02:00 committed by GitHub
commit b528939575
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
48 changed files with 105 additions and 78 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -241,11 +241,16 @@
</template> </template>
<script> <script>
import userRow from './UserList/UserRow' import { subscribe, unsubscribe } from '@nextcloud/event-bus'
import { Multiselect, Actions, ActionButton } from '@nextcloud/vue'
import InfiniteLoading from 'vue-infinite-loading' import InfiniteLoading from 'vue-infinite-loading'
import Vue from 'vue' import Vue from 'vue'
import Multiselect from '@nextcloud/vue/dist/Components/Multiselect'
import Actions from '@nextcloud/vue/dist/Components/Actions'
import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
import userRow from './UserList/UserRow'
const unlimitedQuota = { const unlimitedQuota = {
id: 'none', id: 'none',
label: t('settings', 'Unlimited'), label: t('settings', 'Unlimited'),
@ -407,6 +412,7 @@ export default {
} }
}, },
}, },
mounted() { mounted() {
if (!this.settings.canChangePassword) { if (!this.settings.canChangePassword) {
OC.Notification.showTemporary(t('settings', 'Password change is disabled because the master key is disabled')) OC.Notification.showTemporary(t('settings', 'Password change is disabled because the master key is disabled'))
@ -420,13 +426,19 @@ export default {
/** /**
* Register search * Register search
*/ */
this.userSearch = new OCA.Search(this.search, this.resetSearch) subscribe('nextcloud:unified-search:search', this.search)
subscribe('nextcloud:unified-search:reset', this.resetSearch)
/** /**
* If disabled group but empty, redirect * If disabled group but empty, redirect
*/ */
this.redirectIfDisabled() this.redirectIfDisabled()
}, },
beforeDestroy() {
unsubscribe('nextcloud:unified-search:search', this.search)
unsubscribe('nextcloud:unified-search:reset', this.resetSearch)
},
methods: { methods: {
onScroll(event) { onScroll(event) {
this.scrolled = event.target.scrollTo > 0 this.scrolled = event.target.scrollTo > 0
@ -465,13 +477,13 @@ export default {
}, },
/* SEARCH */ /* SEARCH */
search(query) { search({ query }) {
this.searchQuery = query this.searchQuery = query
this.$store.commit('resetUsers') this.$store.commit('resetUsers')
this.$refs.infiniteLoading.stateChanger.reset() this.$refs.infiniteLoading.stateChanger.reset()
}, },
resetSearch() { resetSearch() {
this.search('') this.search({ query: '' })
}, },
resetForm() { resetForm() {

View File

@ -141,6 +141,10 @@
</template> </template>
<script> <script>
import { subscribe, unsubscribe } from '@nextcloud/event-bus'
import Vue from 'vue'
import VueLocalStorage from 'vue-localstorage'
import AppContent from '@nextcloud/vue/dist/Components/AppContent' import AppContent from '@nextcloud/vue/dist/Components/AppContent'
import AppNavigation from '@nextcloud/vue/dist/Components/AppNavigation' import AppNavigation from '@nextcloud/vue/dist/Components/AppNavigation'
import AppNavigationCounter from '@nextcloud/vue/dist/Components/AppNavigationCounter' import AppNavigationCounter from '@nextcloud/vue/dist/Components/AppNavigationCounter'
@ -149,8 +153,6 @@ import AppNavigationSpacer from '@nextcloud/vue/dist/Components/AppNavigationSpa
import AppSidebar from '@nextcloud/vue/dist/Components/AppSidebar' import AppSidebar from '@nextcloud/vue/dist/Components/AppSidebar'
import AppSidebarTab from '@nextcloud/vue/dist/Components/AppSidebarTab' import AppSidebarTab from '@nextcloud/vue/dist/Components/AppSidebarTab'
import Content from '@nextcloud/vue/dist/Components/Content' import Content from '@nextcloud/vue/dist/Components/Content'
import Vue from 'vue'
import VueLocalStorage from 'vue-localstorage'
import AppList from '../components/AppList' import AppList from '../components/AppList'
import AppDetails from '../components/AppDetails' import AppDetails from '../components/AppDetails'
@ -254,8 +256,8 @@ export default {
}, },
watch: { watch: {
category(val, old) { category() {
this.setSearch('') this.searchQuery = ''
}, },
app() { app() {
@ -276,20 +278,24 @@ export default {
this.$store.dispatch('getGroups', { offset: 0, limit: 5 }) this.$store.dispatch('getGroups', { offset: 0, limit: 5 })
this.$store.commit('setUpdateCount', this.$store.getters.getServerData.updateCount) this.$store.commit('setUpdateCount', this.$store.getters.getServerData.updateCount)
}, },
mounted() { mounted() {
/** subscribe('nextcloud:unified-search:search', this.setSearch)
* Register search subscribe('nextcloud:unified-search:reset', this.resetSearch)
*/ },
this.appSearch = new OCA.Search(this.setSearch, this.resetSearch) beforeDestroy() {
unsubscribe('nextcloud:unified-search:search', this.setSearch)
unsubscribe('nextcloud:unified-search:reset', this.resetSearch)
}, },
methods: { methods: {
setSearch(query) { setSearch({ query }) {
this.searchQuery = query this.searchQuery = query
}, },
resetSearch() { resetSearch() {
this.setSearch('') this.searchQuery = ''
}, },
hideAppDetails() { hideAppDetails() {
this.$router.push({ this.$router.push({
name: 'apps-category', name: 'apps-category',

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -43,7 +43,6 @@
<script> <script>
import { directive as ClickOutside } from 'v-click-outside' import { directive as ClickOutside } from 'v-click-outside'
import { emit, subscribe, unsubscribe } from '@nextcloud/event-bus'
import excludeClickOutsideClasses from '@nextcloud/vue/dist/Mixins/excludeClickOutsideClasses' import excludeClickOutsideClasses from '@nextcloud/vue/dist/Mixins/excludeClickOutsideClasses'
export default { export default {
@ -94,15 +93,8 @@ export default {
mounted() { mounted() {
document.addEventListener('keydown', this.onKeyDown) document.addEventListener('keydown', this.onKeyDown)
}, },
beforeMount() {
subscribe(`header-menu-${this.id}-close`, this.closeMenu)
subscribe(`header-menu-${this.id}-open`, this.openMenu)
},
beforeDestroy() { beforeDestroy() {
unsubscribe(`header-menu-${this.id}-close`, this.closeMenu) document.removeEventListener('keydown', this.onKeyDown)
unsubscribe(`header-menu-${this.id}-open`, this.openMenu)
}, },
methods: { methods: {
@ -129,7 +121,6 @@ export default {
this.opened = false this.opened = false
this.$emit('close') this.$emit('close')
this.$emit('update:open', false) this.$emit('update:open', false)
emit(`header-menu-${this.id}-close`)
}, },
/** /**
@ -143,14 +134,19 @@ export default {
this.opened = true this.opened = true
this.$emit('open') this.$emit('open')
this.$emit('update:open', true) this.$emit('update:open', true)
emit(`header-menu-${this.id}-open`)
}, },
onKeyDown(event) { onKeyDown(event) {
// If opened and escape pressed, close // If opened and escape pressed, close
if (event.key === 'Escape' && this.opened) { if (event.key === 'Escape' && this.opened) {
event.preventDefault() event.preventDefault()
this.closeMenu()
/** user cancelled the menu by pressing escape */
this.$emit('cancel')
/** we do NOT fire a close event to differentiate cancel and close */
this.opened = false
this.$emit('update:open', false)
} }
}, },
}, },

View File

@ -39,7 +39,8 @@
type="search" type="search"
:placeholder="t('core', 'Search {types} …', { types: typesNames.join(', ').toLowerCase() })" :placeholder="t('core', 'Search {types} …', { types: typesNames.join(', ').toLowerCase() })"
@input="onInputDebounced" @input="onInputDebounced"
@keypress.enter.prevent.stop="onInputEnter"> @keypress.enter.prevent.stop="onInputEnter"
@search="onSearch">
<!-- Search filters --> <!-- Search filters -->
<Actions v-if="availableFilters.length > 1" class="unified-search__filters" placement="bottom"> <Actions v-if="availableFilters.length > 1" class="unified-search__filters" placement="bottom">
<ActionButton v-for="type in availableFilters" <ActionButton v-for="type in availableFilters"
@ -288,11 +289,17 @@ export default {
this.types = await getTypes() this.types = await getTypes()
}, },
onClose() { onClose() {
this.resetState()
this.query = ''
emit('nextcloud:unified-search:close') emit('nextcloud:unified-search:close')
}, },
/**
* Reset the search state
*/
resetSearch() {
emit('nextcloud:unified-search:reset')
this.query = ''
this.resetState()
},
resetState() { resetState() {
this.cursors = {} this.cursors = {}
this.limits = {} this.limits = {}
@ -312,6 +319,18 @@ export default {
}) })
}, },
/**
* Watch the search event on the input
* Used to detect the reset button press
* @param {Event} event the search event
*/
onSearch(event) {
// If value is empty, the reset button has been pressed
if (event.target.value === '') {
this.resetSearch()
}
},
/** /**
* If we have results already, open first one * If we have results already, open first one
* If not, trigger the search again * If not, trigger the search again