feat: use v-model more consequent (#2356)

Co-authored-by: Dominik Pschenitschni <mail@celement.de>
Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/2356
Reviewed-by: konrad <k@knt.li>
Co-authored-by: Dominik Pschenitschni <dpschen@noreply.kolaente.de>
Co-committed-by: Dominik Pschenitschni <dpschen@noreply.kolaente.de>

src/components/tasks/edit-task.vue

@@ -36,8 +36,8 @@
 
 		<strong>{{ $t('task.attributes.reminders') }}</strong>
 		<reminders
-			@change="editTaskSubmit()"
 			v-model="taskEditTask.reminderDates"
+			@update:model-value="editTaskSubmit()"
 		/>
 
 		<div class="field">

src/components/tasks/partials/comments.vue

@@ -70,13 +70,13 @@
 						:is-edit-enabled="canWrite && c.author.id === currentUserId"
 						:upload-callback="attachmentUpload"
 						:upload-enabled="true"
-						@change="
+						v-model="c.comment"
+						@update:model-value="
 							() => {
 								toggleEdit(c)
 								editComment()
 							}
 						"
-						v-model="c.comment"
 						:bottom-actions="actions[c.id]"
 						:show-save="true"
 					/>

src/components/tasks/partials/description.vue

@@ -20,12 +20,12 @@
 			:is-edit-enabled="canWrite"
 			:upload-callback="attachmentUpload"
 			:upload-enabled="true"
-			@change="save"
 			:placeholder="$t('task.description.placeholder')"
 			:empty-text="$t('task.description.empty')"
 			:show-save="true"
 			edit-shortcut="e"
 			v-model="task.description"
+			@update:model-value="save"
 		/>
 	</div>
 </template>

src/components/tasks/partials/editLabels.vue

@@ -66,7 +66,7 @@ const props = defineProps({
 	},
 })
 
-const emit = defineEmits(['update:modelValue', 'change'])
+const emit = defineEmits(['update:modelValue'])
 
 const store = useStore()
 const {t} = useI18n({useScope: 'global'})
@@ -96,7 +96,6 @@ function findLabel(newQuery: string) {
 async function addLabel(label: ILabel, showNotification = true) {
 	const bubble = () => {
 		emit('update:modelValue', labels.value)
-		emit('change', labels.value)
 	}
 	
 	if (props.taskId === 0) {
@@ -122,7 +121,6 @@ async function removeLabel(label: ILabel) {
 		}
 	}
 	emit('update:modelValue', labels.value)
-	emit('change', labels.value)
 	success({message: t('task.label.removeSuccess')})
 }
 

src/components/tasks/partials/percentDoneSelect.vue

@@ -32,13 +32,12 @@ const props = defineProps({
 	},
 })
 
-const emit = defineEmits(['update:modelValue', 'change'])
+const emit = defineEmits(['update:modelValue'])
 
 const percentDone = computed({
 	get: () => props.modelValue,
 	set(percentDone) {
 		emit('update:modelValue', percentDone)
-		emit('change')
 	},
 })
 </script>

src/components/tasks/partials/prioritySelect.vue

@@ -19,19 +19,19 @@
 import {ref, watch} from 'vue'
 import {PRIORITIES} from '@/constants/priorities'
 
-const priority = ref(0)
-
 const props = defineProps({
 	modelValue: {
-		default: 0,
 		type: Number,
+		default: 0,
 	},
 	disabled: {
 		default: false,
 	},
 })
 
-const emit = defineEmits(['update:modelValue', 'change'])
+const emit = defineEmits(['update:modelValue'])
+
+const priority = ref(0)
 
 // FIXME: store value outside
 // Set the priority to the :value every time it changes from the outside
@@ -45,6 +45,5 @@ watch(
 
 function updateData() {
 	emit('update:modelValue', priority.value)
-	emit('change')
 }
 </script>

src/components/tasks/partials/reminders.vue

@@ -63,7 +63,7 @@ const props = defineProps({
 	},
 })
 
-const emit = defineEmits(['update:modelValue', 'change'])
+const emit = defineEmits(['update:modelValue'])
 
 const reminders = ref<Reminder[]>([])
 
@@ -86,7 +86,6 @@ watch(
 
 function updateData() {
 	emit('update:modelValue', reminders.value)
-	emit('change')
 }
 
 const newReminder = ref(null)

src/components/tasks/partials/repeatAfter.vue

@@ -85,7 +85,7 @@ const props = defineProps({
 
 const {t} = useI18n({useScope: 'global'})
 
-const emit = defineEmits(['update:modelValue', 'change'])
+const emit = defineEmits(['update:modelValue'])
 
 const task = ref<ITask>()
 const repeatAfter = reactive({
@@ -116,7 +116,6 @@ function updateData() {
 
 	Object.assign(task.value.repeatAfter, repeatAfter)
 	emit('update:modelValue', task.value)
-	emit('change')
 }
 
 function setRepeatAfter(amount: number, type: IRepeatAfter['type']) {