Files
thetool/public/plugins/vue/tt-components/tt-select.js
2024-05-08 12:54:26 +00:00

31 lines
980 B
JavaScript

Vue.component('tt-select', {
props: ['options', 'label', 'required', 'value', 'suffix'],
data() {
return {
selectedOption: '',
};
},
mounted() {
this.selectedOption = this.value;
},
watch: {
value(newValue) {
this.selectedOption = newValue;
},
},
template: `
<div class="form-group">
<label v-if="label" :for="label">{{ label }}</label>
<select class="form-control form-control-sm" :required="required" v-model="selectedOption"
@change="$emit('input', $event.target.value)">
<template v-for="option of options">
<option v-if="['string','number'].includes(typeof option)" :value="option">{{ option }}
<template v-if="suffix"> {{ suffix }}</template>
</option>
<option v-else :value="option.value">{{ option.text }}</option>
</template>
</select>
</div>
`
});