feat: prioritySelect script setup (#1925)
Co-authored-by: Dominik Pschenitschni <mail@celement.de> Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/1925 Co-authored-by: Dominik Pschenitschni <dpschen@noreply.kolaente.de> Co-committed-by: Dominik Pschenitschni <dpschen@noreply.kolaente.de>
This commit is contained in:
parent
1bf378608e
commit
99d1c40cfd
1 changed files with 33 additions and 35 deletions
|
@ -1,6 +1,10 @@
|
|||
<template>
|
||||
<div class="select">
|
||||
<select :disabled="disabled || null" @change="updateData" v-model="priority">
|
||||
<select
|
||||
v-model="priority"
|
||||
@change="updateData"
|
||||
:disabled="disabled || undefined"
|
||||
>
|
||||
<option :value="priorities.UNSET">{{ $t('task.priority.unset') }}</option>
|
||||
<option :value="priorities.LOW">{{ $t('task.priority.low') }}</option>
|
||||
<option :value="priorities.MEDIUM">{{ $t('task.priority.medium') }}</option>
|
||||
|
@ -11,19 +15,13 @@
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import {defineComponent} from 'vue'
|
||||
import priorites from '../../../models/constants/priorities'
|
||||
<script setup lang="ts">
|
||||
import {ref, watch} from 'vue'
|
||||
import priorities from '@/models/constants/priorities.json'
|
||||
|
||||
export default defineComponent({
|
||||
name: 'prioritySelect',
|
||||
data() {
|
||||
return {
|
||||
priorities: priorites,
|
||||
priority: 0,
|
||||
}
|
||||
},
|
||||
props: {
|
||||
const priority = ref(0)
|
||||
|
||||
const props = defineProps({
|
||||
modelValue: {
|
||||
default: 0,
|
||||
type: Number,
|
||||
|
@ -31,22 +29,22 @@ export default defineComponent({
|
|||
disabled: {
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
emits: ['update:modelValue', 'change'],
|
||||
watch: {
|
||||
// Set the priority to the :value every time it changes from the outside
|
||||
modelValue: {
|
||||
handler(value) {
|
||||
this.priority = value
|
||||
},
|
||||
immediate: true,
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
updateData() {
|
||||
this.$emit('update:modelValue', this.priority)
|
||||
this.$emit('change')
|
||||
},
|
||||
},
|
||||
})
|
||||
|
||||
const emit = defineEmits(['update:modelValue', 'change'])
|
||||
|
||||
// FIXME: store value outside
|
||||
// Set the priority to the :value every time it changes from the outside
|
||||
watch(
|
||||
() => props.modelValue,
|
||||
(value) => {
|
||||
priority.value = value
|
||||
},
|
||||
{immediate: true},
|
||||
)
|
||||
|
||||
function updateData() {
|
||||
emit('update:modelValue', priority.value)
|
||||
emit('change')
|
||||
}
|
||||
</script>
|
||||
|
|
Loading…
Reference in a new issue