diff --git a/client/src/components/Orga/OrgaActivities.vue b/client/src/components/Orga/OrgaActivities.vue
index 00d69a3..6678d0a 100644
--- a/client/src/components/Orga/OrgaActivities.vue
+++ b/client/src/components/Orga/OrgaActivities.vue
@@ -17,7 +17,8 @@
-import { computed, ref, watch } from 'vue';
+import { computed, type ModelRef, ref, watch } from 'vue';
import type { Ref } from 'vue';
import { useI18n } from 'vue-i18n';
import type { TagOption } from '@/additionalTypes';
@@ -70,7 +70,7 @@ const props = defineProps<{
}>();
const search = ref('');
-const tags: Ref = ref([]);
+const tags = defineModel({ required: true });
const criteria = computed(() => {
return search.value.trim().toLowerCase();
@@ -78,12 +78,12 @@ const criteria = computed(() => {
const availableOptions = computed(() => {
const options = props.options.filter(
- (opt) => tags.value.indexOf(opt) === -1
+ (opt) => tags.value.indexOf(opt) === -1,
);
if (criteria.value) {
// Show only options that match criteria
return options.filter(
- (opt) => opt.desc.toLowerCase().indexOf(criteria.value) > -1
+ (opt) => opt.desc.toLowerCase().indexOf(criteria.value) > -1,
);
}
// Show all options available
@@ -100,17 +100,16 @@ const searchDesc = computed(() => {
function onOptionClick(option: TagOption) {
tags.value.push(option);
search.value = '';
+ emit('change', tags.value);
}
function removeTag(option: TagOption) {
tags.value.splice(tags.value.indexOf(option), 1);
+ emit('change', tags.value);
}
const emit = defineEmits<{ (e: 'change', newValue: TagOption[]): void }>();
-watch(tags, () => {
- emit('change', tags.value);
-});