1
0

feat: defineModel and withDefaults for PercentDoneSelect

This commit is contained in:
Dominik Pschenitschni 2024-07-06 12:26:27 +02:00 committed by konrad
parent 1966cc3c0e
commit 8ac0eb4aa4

View File

@ -4,63 +4,25 @@
v-model.number="percentDone" v-model.number="percentDone"
:disabled="disabled || undefined" :disabled="disabled || undefined"
> >
<option value="0"> <option
0% v-for="option in PERCENT_OPTIONS"
</option> :key="option"
<option value="0.1"> :value="option"
10% >
</option> {{ option * 100 }}%
<option value="0.2">
20%
</option>
<option value="0.3">
30%
</option>
<option value="0.4">
40%
</option>
<option value="0.5">
50%
</option>
<option value="0.6">
60%
</option>
<option value="0.7">
70%
</option>
<option value="0.8">
80%
</option>
<option value="0.9">
90%
</option>
<option value="1">
100%
</option> </option>
</select> </select>
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import {computed} from 'vue' withDefaults(defineProps<{
disabled?: boolean
const props = defineProps({ }>(), {
modelValue: { disabled: false,
default: 0,
type: Number,
},
disabled: {
type: Boolean,
default: false,
},
}) })
const emit = defineEmits(['update:modelValue']) const percentDone = defineModel<number>({ required: true })
const percentDone = computed({ const PERCENT_OPTIONS = [0, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 1] as const
get: () => props.modelValue,
set(percentDone) {
emit('update:modelValue', percentDone)
},
})
</script> </script>