feat: use async / await where it makes sense
This commit is contained in:
@ -54,7 +54,7 @@ export default {
|
||||
this.setTitle(this.$t('list.create.header'))
|
||||
},
|
||||
methods: {
|
||||
newList() {
|
||||
async newList() {
|
||||
if (this.list.title === '') {
|
||||
this.showError = true
|
||||
return
|
||||
@ -62,15 +62,12 @@ export default {
|
||||
this.showError = false
|
||||
|
||||
this.list.namespaceId = parseInt(this.$route.params.id)
|
||||
this.$store
|
||||
.dispatch('lists/createList', this.list)
|
||||
.then((r) => {
|
||||
this.$message.success({message: this.$t('list.create.createdSuccess') })
|
||||
this.$router.push({
|
||||
name: 'list.index',
|
||||
params: { listId: r.id },
|
||||
})
|
||||
})
|
||||
const list = await this.$store.dispatch('lists/createList', this.list)
|
||||
this.$message.success({message: this.$t('list.create.createdSuccess') })
|
||||
this.$router.push({
|
||||
name: 'list.index',
|
||||
params: { listId: list.id },
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
|
@ -83,7 +83,8 @@ export default {
|
||||
this.$router.replace({name: savedListView, params: {id: this.$route.params.listId}})
|
||||
console.debug('Replaced list view with', savedListView)
|
||||
},
|
||||
loadList() {
|
||||
|
||||
async loadList() {
|
||||
if (this.$route.name.includes('.settings.')) {
|
||||
return
|
||||
}
|
||||
@ -139,14 +140,13 @@ export default {
|
||||
|
||||
// We create an extra list object instead of creating it in this.list because that would trigger a ui update which would result in bad ux.
|
||||
const list = new ListModel(listData)
|
||||
this.listService.get(list)
|
||||
.then(r => {
|
||||
this.$store.dispatch(CURRENT_LIST, r)
|
||||
this.setTitle(this.getListTitle(r))
|
||||
})
|
||||
.finally(() => {
|
||||
this.listLoaded = this.$route.params.listId
|
||||
})
|
||||
try {
|
||||
const loadedList = await this.listService.get(list)
|
||||
this.$store.commit(CURRENT_LIST, loadedList)
|
||||
this.setTitle(this.getListTitle(loadedList))
|
||||
} finally {
|
||||
this.listLoaded = this.$route.params.listId
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
|
@ -30,21 +30,20 @@ export default {
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
archiveList() {
|
||||
async archiveList() {
|
||||
const newList = {
|
||||
...this.list,
|
||||
isArchived: !this.list.isArchived,
|
||||
}
|
||||
|
||||
this.listService.update(newList)
|
||||
.then(r => {
|
||||
this.$store.commit('currentList', r)
|
||||
this.$store.commit('namespaces/setListInNamespaceById', r)
|
||||
this.$message.success({message: this.$t('list.archive.success')})
|
||||
})
|
||||
.finally(() => {
|
||||
this.$router.back()
|
||||
})
|
||||
try {
|
||||
const list = await this.listService.update(newList)
|
||||
this.$store.commit('currentList', list)
|
||||
this.$store.commit('namespaces/setListInNamespaceById', list)
|
||||
this.$message.success({message: this.$t('list.archive.success')})
|
||||
} finally {
|
||||
this.$router.back()
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
|
@ -71,6 +71,10 @@ import ListService from '@/services/list'
|
||||
import {CURRENT_LIST} from '@/store/mutation-types'
|
||||
import CreateEdit from '@/components/misc/create-edit.vue'
|
||||
|
||||
function timeout(ms) {
|
||||
return new Promise(resolve => setTimeout(resolve, ms))
|
||||
}
|
||||
|
||||
export default {
|
||||
name: 'list-setting-background',
|
||||
components: {CreateEdit},
|
||||
@ -108,61 +112,53 @@ export default {
|
||||
this.backgroundThumbs = {}
|
||||
this.searchBackgrounds()
|
||||
},
|
||||
searchBackgrounds(page = 1) {
|
||||
|
||||
async searchBackgrounds(page = 1) {
|
||||
if (this.backgroundSearchTimeout !== null) {
|
||||
clearTimeout(this.backgroundSearchTimeout)
|
||||
}
|
||||
|
||||
// We're using the timeout to not search on every keypress but with a 300ms delay.
|
||||
// TODO: use throttle
|
||||
// FIXME: We're using the timeout to not search on every keypress but with a 300ms delay.
|
||||
// If another key is pressed within these 300ms, the last search request is dropped and a new one is scheduled.
|
||||
this.backgroundSearchTimeout = setTimeout(() => {
|
||||
this.currentPage = page
|
||||
this.backgroundService.getAll({}, {s: this.backgroundSearchTerm, p: page})
|
||||
.then(r => {
|
||||
this.backgroundSearchResult = this.backgroundSearchResult.concat(r)
|
||||
r.forEach(b => {
|
||||
this.backgroundService.thumb(b)
|
||||
.then(t => {
|
||||
this.backgroundThumbs[b.id] = t
|
||||
})
|
||||
})
|
||||
})
|
||||
}, 300)
|
||||
this.backgroundSearchTimeout = await timeout(300)
|
||||
this.currentPage = page
|
||||
const r = await this.backgroundService.getAll({}, {s: this.backgroundSearchTerm, p: page})
|
||||
this.backgroundSearchResult = this.backgroundSearchResult.concat(r)
|
||||
r.forEach(async b => {
|
||||
this.backgroundThumbs[b.id] = await this.backgroundService.thumb(b)
|
||||
})
|
||||
},
|
||||
setBackground(backgroundId) {
|
||||
|
||||
async setBackground(backgroundId) {
|
||||
// Don't set a background if we're in the process of setting one
|
||||
if (this.backgroundService.loading) {
|
||||
return
|
||||
}
|
||||
|
||||
this.backgroundService.update({id: backgroundId, listId: this.$route.params.listId})
|
||||
.then(l => {
|
||||
this.$store.commit(CURRENT_LIST, l)
|
||||
this.$store.commit('namespaces/setListInNamespaceById', l)
|
||||
this.$message.success({message: this.$t('list.background.success')})
|
||||
})
|
||||
const list = await this.backgroundService.update({id: backgroundId, listId: this.$route.params.listId})
|
||||
this.$store.commit(CURRENT_LIST, list)
|
||||
this.$store.commit('namespaces/setListInNamespaceById', list)
|
||||
this.$message.success({message: this.$t('list.background.success')})
|
||||
},
|
||||
uploadBackground() {
|
||||
|
||||
async uploadBackground() {
|
||||
if (this.$refs.backgroundUploadInput.files.length === 0) {
|
||||
return
|
||||
}
|
||||
|
||||
this.backgroundUploadService.create(this.$route.params.listId, this.$refs.backgroundUploadInput.files[0])
|
||||
.then(l => {
|
||||
this.$store.commit(CURRENT_LIST, l)
|
||||
this.$store.commit('namespaces/setListInNamespaceById', l)
|
||||
this.$message.success({message: this.$t('list.background.success')})
|
||||
})
|
||||
const list = await this.backgroundUploadService.create(this.$route.params.listId, this.$refs.backgroundUploadInput.files[0])
|
||||
this.$store.commit(CURRENT_LIST, list)
|
||||
this.$store.commit('namespaces/setListInNamespaceById', list)
|
||||
this.$message.success({message: this.$t('list.background.success')})
|
||||
},
|
||||
removeBackground() {
|
||||
this.listService.removeBackground(this.currentList)
|
||||
.then(l => {
|
||||
this.$store.commit(CURRENT_LIST, l)
|
||||
this.$store.commit('namespaces/setListInNamespaceById', l)
|
||||
this.$message.success({message: this.$t('list.background.removeSuccess')})
|
||||
this.$router.back()
|
||||
})
|
||||
|
||||
async removeBackground() {
|
||||
const list = await this.listService.removeBackground(this.currentList)
|
||||
this.$store.commit(CURRENT_LIST, list)
|
||||
this.$store.commit('namespaces/setListInNamespaceById', list)
|
||||
this.$message.success({message: this.$t('list.background.removeSuccess')})
|
||||
this.$router.back()
|
||||
},
|
||||
},
|
||||
}
|
||||
|
@ -24,12 +24,10 @@ export default {
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
deleteList() {
|
||||
this.$store.dispatch('lists/deleteList', this.list)
|
||||
.then(() => {
|
||||
this.$message.success({message: this.$t('list.delete.success')})
|
||||
this.$router.push({name: 'home'})
|
||||
})
|
||||
async deleteList() {
|
||||
await this.$store.dispatch('lists/deleteList', this.list)
|
||||
this.$message.success({message: this.$t('list.delete.success')})
|
||||
this.$router.push({name: 'home'})
|
||||
},
|
||||
},
|
||||
}
|
||||
|
@ -38,18 +38,17 @@ export default {
|
||||
selectNamespace(namespace) {
|
||||
this.selectedNamespace = namespace
|
||||
},
|
||||
duplicateList() {
|
||||
|
||||
async duplicateList() {
|
||||
const listDuplicate = new ListDuplicateModel({
|
||||
listId: this.$route.params.listId,
|
||||
namespaceId: this.selectedNamespace.id,
|
||||
})
|
||||
this.listDuplicateService.create(listDuplicate)
|
||||
.then(r => {
|
||||
this.$store.commit('namespaces/addListToNamespace', r.list)
|
||||
this.$store.commit('lists/setList', r.list)
|
||||
this.$message.success({message: this.$t('list.duplicate.success')})
|
||||
this.$router.push({name: 'list.index', params: {listId: r.list.id}})
|
||||
})
|
||||
const duplicate = await this.listDuplicateService.create(listDuplicate)
|
||||
this.$store.commit('namespaces/addListToNamespace', duplicate.list)
|
||||
this.$store.commit('lists/setList', duplicate.list)
|
||||
this.$message.success({message: this.$t('list.duplicate.success')})
|
||||
this.$router.push({name: 'list.index', params: {listId: duplicate.list.id}})
|
||||
},
|
||||
},
|
||||
}
|
||||
|
@ -94,22 +94,19 @@ export default {
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
loadList() {
|
||||
async loadList() {
|
||||
const list = new ListModel({id: this.$route.params.listId})
|
||||
|
||||
this.listService.get(list)
|
||||
.then(r => {
|
||||
this.list = { ...r }
|
||||
})
|
||||
const loadedList = await this.listService.get(list)
|
||||
this.list = { ...loadedList }
|
||||
},
|
||||
save() {
|
||||
this.$store.dispatch('lists/updateList', this.list)
|
||||
.then(() => {
|
||||
this.$store.commit(CURRENT_LIST, this.list)
|
||||
this.setTitle(this.$t('list.edit.title', {list: this.list.title}))
|
||||
this.$message.success({message: this.$t('list.edit.success')})
|
||||
this.$router.back()
|
||||
})
|
||||
|
||||
async save() {
|
||||
await this.$store.dispatch('lists/updateList', this.list)
|
||||
this.$store.commit(CURRENT_LIST, this.list)
|
||||
this.setTitle(this.$t('list.edit.title', {list: this.list.title}))
|
||||
this.$message.success({message: this.$t('list.edit.success')})
|
||||
this.$router.back()
|
||||
},
|
||||
},
|
||||
}
|
||||
|
@ -56,18 +56,15 @@ export default {
|
||||
this.loadList()
|
||||
},
|
||||
methods: {
|
||||
loadList() {
|
||||
async loadList() {
|
||||
const list = new ListModel({id: this.$route.params.listId})
|
||||
|
||||
this.listService.get(list)
|
||||
.then(r => {
|
||||
this.list = r
|
||||
this.$store.commit(CURRENT_LIST, r)
|
||||
// This will trigger the dynamic loading of components once we actually have all the data to pass to them
|
||||
this.manageTeamsComponent = 'userTeam'
|
||||
this.manageUsersComponent = 'userTeam'
|
||||
this.setTitle(this.$t('list.share.title', {list: this.list.title}))
|
||||
})
|
||||
this.list = await this.listService.get(list)
|
||||
this.$store.commit(CURRENT_LIST, this.list)
|
||||
// This will trigger the dynamic loading of components once we actually have all the data to pass to them
|
||||
this.manageTeamsComponent = 'userTeam'
|
||||
this.manageUsersComponent = 'userTeam'
|
||||
this.setTitle(this.$t('list.share.title', {list: this.list.title}))
|
||||
},
|
||||
},
|
||||
}
|
||||
|
@ -408,7 +408,7 @@ export default {
|
||||
this.$store.dispatch('kanban/updateBucket', newBucket)
|
||||
},
|
||||
|
||||
updateTaskPosition(e) {
|
||||
async updateTaskPosition(e) {
|
||||
this.drag = false
|
||||
|
||||
// While we could just pass the bucket index in through the function call, this would not give us the
|
||||
@ -427,34 +427,35 @@ export default {
|
||||
kanbanPosition: calculateItemPosition(taskBefore !== null ? taskBefore.kanbanPosition : null, taskAfter !== null ? taskAfter.kanbanPosition : null),
|
||||
}
|
||||
|
||||
this.$store.dispatch('tasks/update', newTask)
|
||||
// .finally(() => {
|
||||
this.taskUpdating[task.id] = false
|
||||
this.oneTaskUpdating = false
|
||||
// })
|
||||
try {
|
||||
await this.$store.dispatch('tasks/update', newTask)
|
||||
} finally {
|
||||
this.taskUpdating[task.id] = false
|
||||
this.oneTaskUpdating = false
|
||||
}
|
||||
},
|
||||
|
||||
toggleShowNewTaskInput(bucketId) {
|
||||
this.showNewTaskInput[bucketId] = !this.showNewTaskInput[bucketId]
|
||||
},
|
||||
addTaskToBucket(bucketId) {
|
||||
|
||||
async addTaskToBucket(bucketId) {
|
||||
if (this.newTaskText === '') {
|
||||
this.newTaskError[bucketId] = true
|
||||
return
|
||||
}
|
||||
this.newTaskError[bucketId] = false
|
||||
|
||||
this.$store.dispatch('tasks/createNewTask', {
|
||||
const task = await this.$store.dispatch('tasks/createNewTask', {
|
||||
title: this.newTaskText,
|
||||
bucketId,
|
||||
listId: this.$route.params.listId,
|
||||
})
|
||||
.then(r => {
|
||||
this.newTaskText = ''
|
||||
this.$store.commit('kanban/addTaskToBucket', r)
|
||||
this.scrollTaskContainerToBottom(bucketId)
|
||||
})
|
||||
this.newTaskText = ''
|
||||
this.$store.commit('kanban/addTaskToBucket', task)
|
||||
this.scrollTaskContainerToBottom(bucketId)
|
||||
},
|
||||
|
||||
scrollTaskContainerToBottom(bucketId) {
|
||||
const bucketEl = this.taskContainerRefs[bucketId]
|
||||
if (!bucketEl) {
|
||||
@ -462,7 +463,8 @@ export default {
|
||||
}
|
||||
bucketEl.scrollTop = bucketEl.scrollHeight
|
||||
},
|
||||
createNewBucket() {
|
||||
|
||||
async createNewBucket() {
|
||||
if (this.newBucketTitle === '') {
|
||||
return
|
||||
}
|
||||
@ -472,12 +474,11 @@ export default {
|
||||
listId: parseInt(this.$route.params.listId),
|
||||
})
|
||||
|
||||
this.$store.dispatch('kanban/createBucket', newBucket)
|
||||
.then(() => {
|
||||
this.newBucketTitle = ''
|
||||
this.showNewBucketInput = false
|
||||
})
|
||||
await this.$store.dispatch('kanban/createBucket', newBucket)
|
||||
this.newBucketTitle = ''
|
||||
this.showNewBucketInput = false
|
||||
},
|
||||
|
||||
deleteBucketModal(bucketId) {
|
||||
if (this.buckets.length <= 1) {
|
||||
return
|
||||
@ -486,33 +487,39 @@ export default {
|
||||
this.bucketToDelete = bucketId
|
||||
this.showBucketDeleteModal = true
|
||||
},
|
||||
deleteBucket() {
|
||||
this.$store.dispatch('kanban/deleteBucket', {bucket: {
|
||||
|
||||
async deleteBucket() {
|
||||
const bucket = new BucketModel({
|
||||
id: this.bucketToDelete,
|
||||
listId: parseInt(this.$route.params.listId),
|
||||
}, params: this.params})
|
||||
.then(() => this.$message.success({message: this.$t('list.kanban.deleteBucketSuccess')}))
|
||||
.finally(() => {
|
||||
this.showBucketDeleteModal = false
|
||||
})
|
||||
|
||||
try {
|
||||
await this.$store.dispatch('kanban/deleteBucket', {
|
||||
bucket,
|
||||
params: this.params,
|
||||
})
|
||||
this.$message.success({message: this.$t('list.kanban.deleteBucketSuccess')})
|
||||
} finally {
|
||||
this.showBucketDeleteModal = false
|
||||
}
|
||||
},
|
||||
|
||||
focusBucketTitle(e) {
|
||||
// This little helper allows us to drag a bucket around at the title without focusing on it right away.
|
||||
this.bucketTitleEditable = true
|
||||
this.$nextTick(() => e.target.focus())
|
||||
},
|
||||
|
||||
saveBucketTitle(bucketId, bucketTitle) {
|
||||
async saveBucketTitle(bucketId, bucketTitle) {
|
||||
const updatedBucketData = {
|
||||
id: bucketId,
|
||||
title: bucketTitle,
|
||||
}
|
||||
|
||||
this.$store.dispatch('kanban/updateBucketTitle', updatedBucketData)
|
||||
.then(() => {
|
||||
this.bucketTitleEditable = false
|
||||
this.$message.success({message: this.$t('list.kanban.bucketTitleSavedSuccess')})
|
||||
})
|
||||
await this.$store.dispatch('kanban/updateBucketTitle', updatedBucketData)
|
||||
this.bucketTitleEditable = false
|
||||
this.$message.success({message: this.$t('list.kanban.bucketTitleSavedSuccess')})
|
||||
},
|
||||
|
||||
updateBuckets(value) {
|
||||
@ -535,7 +542,8 @@ export default {
|
||||
|
||||
this.$store.dispatch('kanban/updateBucket', updatedData)
|
||||
},
|
||||
setBucketLimit(bucketId, limit) {
|
||||
|
||||
async setBucketLimit(bucketId, limit) {
|
||||
if (limit < 0) {
|
||||
return
|
||||
}
|
||||
@ -545,27 +553,30 @@ export default {
|
||||
limit,
|
||||
}
|
||||
|
||||
this.$store.dispatch('kanban/updateBucket', newBucket)
|
||||
.then(() => this.$message.success({message: this.$t('list.kanban.bucketLimitSavedSuccess')}))
|
||||
|
||||
await this.$store.dispatch('kanban/updateBucket', newBucket)
|
||||
this.$message.success({message: this.$t('list.kanban.bucketLimitSavedSuccess')})
|
||||
},
|
||||
|
||||
shouldAcceptDrop(bucket) {
|
||||
return bucket.id === this.sourceBucket || // When dragging from a bucket who has its limit reached, dragging should still be possible
|
||||
bucket.limit === 0 || // If there is no limit set, dragging & dropping should always work
|
||||
bucket.tasks.length < bucket.limit // Disallow dropping to buckets which have their limit reached
|
||||
},
|
||||
|
||||
dragstart(bucket) {
|
||||
this.drag = true
|
||||
this.sourceBucket = bucket.id
|
||||
},
|
||||
toggleDoneBucket(bucket) {
|
||||
|
||||
async toggleDoneBucket(bucket) {
|
||||
const newBucket = {
|
||||
...bucket,
|
||||
isDoneBucket: !bucket.isDoneBucket,
|
||||
}
|
||||
this.$store.dispatch('kanban/updateBucket', newBucket)
|
||||
.then(() => this.$message.success({message: this.$t('list.kanban.doneBucketSavedSuccess')}))
|
||||
await this.$store.dispatch('kanban/updateBucket', newBucket)
|
||||
this.$message.success({message: this.$t('list.kanban.doneBucketSavedSuccess')})
|
||||
},
|
||||
|
||||
collapseBucket(bucket) {
|
||||
this.collapsedBuckets[bucket.id] = true
|
||||
saveCollapsedBucketState(this.$route.params.listId, this.collapsedBuckets)
|
||||
|
@ -291,7 +291,8 @@ export default {
|
||||
}
|
||||
sortTasks(this.tasks)
|
||||
},
|
||||
saveTaskPosition(e) {
|
||||
|
||||
async saveTaskPosition(e) {
|
||||
this.drag = false
|
||||
|
||||
const task = this.tasks[e.newIndex]
|
||||
@ -303,10 +304,8 @@ export default {
|
||||
position: calculateItemPosition(taskBefore !== null ? taskBefore.position : null, taskAfter !== null ? taskAfter.position : null),
|
||||
}
|
||||
|
||||
this.$store.dispatch('tasks/update', newTask)
|
||||
.then(r => {
|
||||
this.tasks[e.newIndex] = r
|
||||
})
|
||||
const updatedTask = await this.$store.dispatch('tasks/update', newTask)
|
||||
this.tasks[e.newIndex] = updatedTask
|
||||
},
|
||||
},
|
||||
}
|
||||
|
Reference in New Issue
Block a user