Add "close on change" event which only fires if the component closed and the value actually changed

src/components/input/datepicker.vue

@@ -122,6 +122,7 @@ export default {
 		return {
 			date: null,
 			show: false,
+			changed: false,
 
 			flatPickerConfig: {
 				altFormat: 'j M Y H:i',
@@ -170,6 +171,7 @@ export default {
 	},
 	methods: {
 		updateData() {
+			this.changed = true
 			this.$emit('input', this.date)
 			this.$emit('change', this.date)
 		},
@@ -205,7 +207,11 @@ export default {
 		},
 		close() {
 			this.show = false
-			this.$emit('close')
+			this.$emit('close', this.changed)
+			if(this.changed) {
+				this.changed = false
+				this.$emit('close-on-change', this.changed)
+			}
 		},
 		setDate(date) {
 			if (this.date === null) {

src/components/tasks/partials/reminders.vue

@@ -9,7 +9,7 @@
 			<datepicker
 				v-model="reminders[index]"
 				:disabled="disabled"
-				@close="() => addReminderDate(index)"
+				@close-on-change="() => addReminderDate(index)"
 			/>
 			<a @click="removeReminderByIndex(index)" v-if="!disabled" class="remove">
 				<icon icon="times"></icon>
@@ -18,7 +18,7 @@
 		<div class="reminder-input" v-if="!disabled">
 			<datepicker
 				v-model="newReminder"
-				@close="addReminderDate"
+				@close-on-change="() => addReminderDate()"
 				choose-date-label="Add a new reminder..."
 			/>
 		</div>

src/views/tasks/TaskDetailView.vue

@@ -49,7 +49,7 @@
 							<div class="date-input">
 								<datepicker
 									v-model="task.dueDate"
-									@close="() => saveTask()"
+									@close-on-change="() => saveTask()"
 									choose-date-label="Click here to set a due date"
 									:disabled="taskService.loading || !canWrite"
 									ref="dueDate"
@@ -82,7 +82,7 @@
 							<div class="date-input">
 								<datepicker
 									v-model="task.startDate"
-									@close="() => saveTask()"
+									@close-on-change="() => saveTask()"
 									choose-date-label="Click here to set a start date"
 									:disabled="taskService.loading || !canWrite"
 									ref="startDate"
@@ -103,7 +103,7 @@
 							<div class="date-input">
 								<datepicker
 									v-model="task.endDate"
-									@close="() => saveTask()"
+									@close-on-change="() => saveTask()"
 									choose-date-label="Click here to set an end date"
 									:disabled="taskService.loading || !canWrite"
 									ref="endDate"