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:

committed by
konrad

parent
2013924949
commit
db8b8812af
@ -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>
|
||||
|
Reference in New Issue
Block a user