Search for tasks
This commit is contained in:
parent
98744936aa
commit
4692a1046d
|
@ -18,6 +18,12 @@
|
||||||
<script>
|
<script>
|
||||||
import Multiselect from '@/components/input/multiselect'
|
import Multiselect from '@/components/input/multiselect'
|
||||||
|
|
||||||
|
import TaskService from '@/services/task'
|
||||||
|
|
||||||
|
const TYPE_LIST = 'list'
|
||||||
|
const TYPE_TASK = 'task'
|
||||||
|
const TYPE_ACTION = 'action'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'quick-actions',
|
name: 'quick-actions',
|
||||||
components: {
|
components: {
|
||||||
|
@ -26,25 +32,87 @@ export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
query: '',
|
query: '',
|
||||||
|
availableActions: [
|
||||||
|
{
|
||||||
|
title: 'New task',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'New list',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'New namespace',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'New Team',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
foundTasks: [],
|
||||||
|
taskSearchTimeout: null,
|
||||||
|
taskService: null,
|
||||||
|
|
||||||
|
foundTeams: [],
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
active: () => true, // TODO: use state + keyboard shortcut
|
active: () => true, // TODO: use state + keyboard shortcut
|
||||||
results() {
|
results() {
|
||||||
return Object.values(this.$store.state.lists).filter(l => {
|
const lists = (Object.values(this.$store.state.lists).filter(l => {
|
||||||
return l.title.toLowerCase().includes(this.query.toLowerCase())
|
return l.title.toLowerCase().includes(this.query.toLowerCase())
|
||||||
}) ?? []
|
}) ?? [])
|
||||||
|
.map(l => {
|
||||||
|
l.type = TYPE_LIST
|
||||||
|
return l
|
||||||
|
})
|
||||||
|
|
||||||
|
const actions = this.availableActions
|
||||||
|
.filter(a => a.title.includes(this.query.toLowerCase()))
|
||||||
|
.map(a => {
|
||||||
|
a.type = TYPE_ACTION
|
||||||
|
return a
|
||||||
|
})
|
||||||
|
|
||||||
|
return [...actions, ...lists, ...this.foundTasks, ...this.foundTeams]
|
||||||
},
|
},
|
||||||
nothing() {
|
nothing() {
|
||||||
return this.search === '' || Object.keys(this.results).length === 0
|
return this.search === '' || Object.keys(this.results).length === 0
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
created() {
|
||||||
|
this.taskService = new TaskService()
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
search(query) {
|
search(query) {
|
||||||
this.query = query
|
this.query = query
|
||||||
|
this.searchTasks(query)
|
||||||
|
},
|
||||||
|
searchTasks(query) {
|
||||||
|
if (this.taskSearchTimeout !== null) {
|
||||||
|
clearTimeout(this.taskSearchTimeout)
|
||||||
|
this.taskSearchTimeout = null
|
||||||
|
}
|
||||||
|
|
||||||
|
this.taskSearchTimeout = setTimeout(() => {
|
||||||
|
this.taskService.getAll({}, {s: query})
|
||||||
|
.then(r => {
|
||||||
|
r = r.map(t => {
|
||||||
|
t.type = TYPE_TASK
|
||||||
|
return t
|
||||||
|
})
|
||||||
|
this.$set(this, 'foundTasks', r)
|
||||||
|
})
|
||||||
|
}, 150)
|
||||||
},
|
},
|
||||||
select(e) {
|
select(e) {
|
||||||
console.log('select', e)
|
switch (e.type) {
|
||||||
|
case TYPE_LIST:
|
||||||
|
this.$router.push({name: 'list.index', params: {listId: e.id}})
|
||||||
|
break
|
||||||
|
case TYPE_TASK:
|
||||||
|
this.$router.push({name: 'task.detail', params: {id: e.id}})
|
||||||
|
break
|
||||||
|
case TYPE_ACTION:
|
||||||
|
break
|
||||||
|
}
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|
Reference in New Issue