Make sure attachements are only added once to the list after uploading

+ Make sure the attachment list shows up every time after adding an attachment

src/components/input/multiselect.vue

@@ -302,8 +302,6 @@ export default {
 		},
 		createOrSelectOnEnter() {
 
-			console.log('enter', this.creatableAvailable, this.searchResults.length)
-
 			if (!this.creatableAvailable && this.searchResults.length === 1) {
 				this.select(this.searchResults[0])
 				return

src/components/tasks/mixins/attachmentUpload.js

@@ -8,13 +8,20 @@ export default {
 
 			const attachmentService = new AttachmentService()
 
+			this.createAttachment(attachmentService, files, onSuccess)
+		},
+		createAttachment(attachmentService, files, onSuccess = () => {}) {
 			const attachmentModel = new AttachmentModel({taskId: this.taskId})
 			attachmentService.create(attachmentModel, files)
 				.then(r => {
 					if (r.success !== null) {
 						r.success.forEach(a => {
+							this.$store.commit('attachments/removeById', a.id)
 							this.$store.commit('attachments/add', a)
-							this.$store.dispatch('tasks/addTaskAttachment', {taskId: this.taskId, attachment: a})
+							this.$store.dispatch('tasks/addTaskAttachment', {
+								taskId: this.taskId,
+								attachment: a,
+							})
 							onSuccess(`${window.API_URL}/tasks/${this.taskId}/attachments/${a.id}`)
 						})
 					}

src/components/tasks/partials/attachments.vue

@@ -56,18 +56,13 @@
 					</p>
 					<p>
 						<a
-							@click="downloadAttachment(a)"
+							@click.prevent.stop="downloadAttachment(a)"
 							v-tooltip="'Download this attachment'"
 						>
 							Download
 						</a>
 						<a
-							@click="
+							@click.prevent.stop="() => {attachmentToDelete = a; showDeleteModal = true}"
-								() => {
-									attachmentToDelete = a
-									showDeleteModal = true
-								}
-							"
 							v-if="editEnabled"
 							v-tooltip="'Delete this attachment'"
 						>
@@ -138,6 +133,7 @@
 import AttachmentService from '../../../services/attachment'
 import AttachmentModel from '../../../models/attachment'
 import User from '../../misc/user'
+import attachmentUpload from '@/components/tasks/mixins/attachmentUpload'
 import { mapState } from 'vuex'
 
 export default {
@@ -145,6 +141,9 @@ export default {
 	components: {
 		User,
 	},
+	mixins: [
+		attachmentUpload,
+	],
 	data() {
 		return {
 			attachmentService: AttachmentService,
@@ -215,28 +214,7 @@ export default {
 			this.uploadFiles(this.$refs.files.files)
 		},
 		uploadFiles(files) {
-			const attachmentModel = new AttachmentModel({ taskId: this.taskId })
+			this.createAttachment(this.attachmentService, files)
-			this.attachmentService
-				.create(attachmentModel, files)
-				.then((r) => {
-					if (r.success !== null) {
-						r.success.forEach((a) => {
-							this.$store.commit('attachments/add', a)
-							this.$store.dispatch('tasks/addTaskAttachment', {
-								taskId: this.taskId,
-								attachment: a,
-							})
-						})
-					}
-					if (r.errors !== null) {
-						r.errors.forEach((m) => {
-							this.error(m)
-						})
-					}
-				})
-				.catch((e) => {
-					this.error(e, this)
-				})
 		},
 		deleteAttachment() {
 			this.attachmentService

src/views/tasks/TaskDetailView.vue

@@ -200,7 +200,7 @@
 					</div>
 
 					<!-- Attachments -->
-					<div class="content attachments" v-if="activeFields.attachments">
+					<div class="content attachments" v-if="activeFields.attachments || hasAttachments">
 						<attachments
 							:edit-enabled="canWrite"
 							:task-id="taskId"
@@ -524,6 +524,9 @@ export default {
 		doneFormatted() {
 			return this.formatDate(this.task.doneAt)
 		},
+		hasAttachments() {
+			return this.$store.state.attachments.attachments.length > 0
+		},
 	},
 	methods: {
 		loadTask() {