UI: Use unified search input

Signed-off-by: Marcel Klehr <mklehr@gmx.net>
This commit is contained in:
Marcel Klehr 2021-01-22 14:11:32 +01:00
parent 1b01fe6f7d
commit 533551653d
4 changed files with 32 additions and 44 deletions

39
package-lock.json generated
View File

@ -3854,15 +3854,26 @@
"semver": "^7.3.2"
},
"dependencies": {
"core-js": {
"version": "3.6.5",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-3.6.5.tgz",
"integrity": "sha512-vZVEEwZoIsI+vPEuoF9Iqf5H7/M3eeQqWlQnYa8FSKKePuYTf5MWnxb5SDAzCa60b3JBRS5g9b+Dq7b1y/RCrA=="
"lru-cache": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
"integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
"requires": {
"yallist": "^4.0.0"
}
},
"semver": {
"version": "7.3.2",
"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.2.tgz",
"integrity": "sha512-OrOb32TeeambH6UrhtShmF7CRDqhL6/5XpPNp2DuRH6+9QLw/orhp72j87v8Qa1ScDkvrrBNpZcDejAirJmfXQ=="
"version": "7.3.4",
"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.4.tgz",
"integrity": "sha512-tCfb2WLjqFAtXn4KEdxIhalnRtoKFN7nAwj0B3ZXCbQloV2tq5eDbcTmT68JJD3nRJq24/XgxtQKFIpQdtvmVw==",
"requires": {
"lru-cache": "^6.0.0"
}
},
"yallist": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
"integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
}
}
},
@ -4030,11 +4041,6 @@
"integrity": "sha1-aaI6OtKcrwCX8G7aWbNh7i8GOfY=",
"dev": true
},
"@types/node": {
"version": "14.0.11",
"resolved": "https://registry.npmjs.org/@types/node/-/node-14.0.11.tgz",
"integrity": "sha512-lCvvI24L21ZVeIiyIUHZ5Oflv1hhHQ5E1S25IRlKIXaRkVgmXpJMI3wUJkmym2bTbCe+WoIibQnMVAU3FguaOg=="
},
"@types/normalize-package-data": {
"version": "2.4.0",
"resolved": "https://registry.npmjs.org/@types/normalize-package-data/-/normalize-package-data-2.4.0.tgz",
@ -4048,12 +4054,9 @@
"dev": true
},
"@types/semver": {
"version": "7.2.0",
"resolved": "https://registry.npmjs.org/@types/semver/-/semver-7.2.0.tgz",
"integrity": "sha512-TbB0A8ACUWZt3Y6bQPstW9QNbhNeebdgLX4T/ZfkrswAfUzRiXrgd9seol+X379Wa589Pu4UEx9Uok0D4RjRCQ==",
"requires": {
"@types/node": "*"
}
"version": "7.3.4",
"resolved": "https://registry.npmjs.org/@types/semver/-/semver-7.3.4.tgz",
"integrity": "sha512-+nVsLKlcUCeMzD2ufHEYuJ9a2ovstb6Dp52A5VsoKxDXgvE051XgHI/33I1EymwkRGQkwnA0LkhnUzituGs4EQ=="
},
"@types/unist": {
"version": "2.0.3",

View File

@ -23,6 +23,7 @@
"@nextcloud/auth": "^1.3.0",
"@nextcloud/axios": "^1.5.0",
"@nextcloud/dialogs": "^3.1.1",
"@nextcloud/event-bus": "^1.2.0",
"@nextcloud/initial-state": "^1.2.0",
"@nextcloud/router": "^1.2.0",
"@nextcloud/vue": "^2.8.2",

View File

@ -7,14 +7,6 @@
<template>
<div :class="['controls', $store.state.public && 'wide']">
<div class="controls__left">
<button
v-if="$route.name !== routes.SEARCH"
v-tooltip="t('bookmarks', 'Search')"
class="custom-button"
:title="t('bookmarks', 'Search')"
@click="openSearch">
<MagnifyIcon :fill-color="colorMainText" class="action-button-mdi-icon" />
</button>
<template v-if="$route.name === routes.FOLDER || $route.name === routes.HOME || $store.state.public">
<a :class="!isPublic? 'icon-home' : 'icon-public'" @click="onSelectHome" />
<span class="icon-breadcrumb" />
@ -41,10 +33,6 @@
:placeholder="t('bookmarks', 'Select one or more tags')"
@input="onTagsChange" />
</template>
<template v-if="$route.name === routes.SEARCH">
<MagnifyIcon :fill-color="colorMainText" />
<input ref="search" v-model="search" type="search">
</template>
<Actions
v-if="!isPublic"
class="controls__AddFolder"
@ -117,13 +105,12 @@ import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
import ActionSeparator from '@nextcloud/vue/dist/Components/ActionSeparator'
import RssIcon from 'vue-material-design-icons/Rss'
import FolderMoveIcon from 'vue-material-design-icons/FolderMove'
import MagnifyIcon from 'vue-material-design-icons/Magnify'
import { actions, mutations } from '../store/'
import { generateUrl } from '@nextcloud/router'
export default {
name: 'Controls',
components: { Multiselect, Actions, ActionButton, ActionSeparator, FolderMoveIcon, RssIcon, MagnifyIcon },
components: { Multiselect, Actions, ActionButton, ActionSeparator, FolderMoveIcon, RssIcon },
props: {},
data() {
return {
@ -193,11 +180,6 @@ export default {
)
},
},
watch: {
search() {
this.$router.push({ name: this.routes.SEARCH, params: { search: this.search } })
},
},
created() {},
methods: {
onSelectHome() {
@ -260,13 +242,6 @@ export default {
openRssUrl() {
window.open(this.rssURL)
},
openSearch() {
this.$router.push({ name: this.routes.SEARCH, params: { search: '' } })
setTimeout(() => {
this.$refs.search.focus()
}, 100)
},
},
}
</script>

View File

@ -9,6 +9,7 @@ import App from './App'
import router from './router'
import store from './store/'
import AppGlobal from './mixins/AppGlobal'
import { subscribe } from '@nextcloud/event-bus'
// import { generateUrl } from '@nextcloud/router'
Vue.mixin(AppGlobal)
@ -18,6 +19,14 @@ const BookmarksApp = (global.Bookmarks = new Vue({
el: '#content',
store,
router,
created() {
subscribe('nextcloud:unified-search.search', ({ query }) => {
this.$router.push({ name: this.routes.SEARCH, params: { search: query } })
})
subscribe('nextcloud:unified-search.reset', () => {
this.$router.push({ name: this.routes.HOME })
})
},
render: h => h(App),
}))