1
0

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>
This commit is contained in:
Dominik Pschenitschni
2022-09-13 15:30:33 +00:00
committed by konrad
parent 2013924949
commit db8b8812af
18 changed files with 63 additions and 71 deletions

View File

@ -5,7 +5,7 @@
:icon="iconName"
v-tooltip="tooltipText"
@click="changeSubscription"
:disabled="disabled || undefined"
:disabled="disabled"
>
{{ buttonText }}
</x-button>
@ -23,6 +23,7 @@
v-tooltip="tooltipText"
@click="changeSubscription"
:class="{'is-disabled': disabled}"
:disabled="disabled"
>
<span class="icon">
<icon :icon="iconName"/>
@ -51,7 +52,7 @@ const props = defineProps({
type: Boolean,
default: true,
},
subscription: {
modelValue: {
type: Object as PropType<ISubscription>,
default: null,
},
@ -61,9 +62,9 @@ const props = defineProps({
},
})
const subscriptionEntity = computed<string | null>(() => props.subscription?.entity ?? null)
const subscriptionEntity = computed<string | null>(() => props.modelValue?.entity ?? null)
const emit = defineEmits(['change'])
const emit = defineEmits(['update:modelValue'])
const subscriptionService = shallowRef(new SubscriptionService())
@ -76,27 +77,21 @@ const tooltipText = computed(() => {
})
}
return props.subscription !== null ?
return props.modelValue !== null ?
t('task.subscription.subscribed', {entity: props.entity}) :
t('task.subscription.notSubscribed', {entity: props.entity})
})
const buttonText = computed(() => props.subscription !== null ? t('task.subscription.unsubscribe') : t('task.subscription.subscribe'))
const iconName = computed(() => props.subscription !== null ? ['far', 'bell-slash'] : 'bell')
const disabled = computed(() => {
if (props.subscription === null) {
return false
}
return subscriptionEntity.value !== props.entity
})
const buttonText = computed(() => props.modelValue ? t('task.subscription.unsubscribe') : t('task.subscription.subscribe'))
const iconName = computed(() => props.modelValue ? ['far', 'bell-slash'] : 'bell')
const disabled = computed(() => props.modelValue && subscriptionEntity.value !== props.entity)
function changeSubscription() {
if (disabled.value) {
return
}
if (props.subscription === null) {
if (props.modelValue === null) {
subscribe()
} else {
unsubscribe()
@ -109,7 +104,7 @@ async function subscribe() {
entityId: props.entityId,
})
await subscriptionService.value.create(subscription)
emit('change', subscription)
emit('update:modelValue', subscription)
success({message: t('task.subscription.subscribeSuccess', {entity: props.entity})})
}
@ -119,7 +114,7 @@ async function unsubscribe() {
entityId: props.entityId,
})
await subscriptionService.value.delete(subscription)
emit('change', null)
emit('update:modelValue', null)
success({message: t('task.subscription.unsubscribeSuccess', {entity: props.entity})})
}
</script>