65 lines
1.2 KiB
Vue
Executable File
65 lines
1.2 KiB
Vue
Executable File
<template>
|
|
<label>
|
|
<span :style="{ width: width + 'em' }">{{ $t(labelTr) }}</span>
|
|
<input type="number" :value="value" :title="$t(tooltipTr)" :min="min" :max="max"
|
|
:disabled="disabled" @change="updateValue($event.target.value)" />
|
|
</label>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: "InputNumberWidget",
|
|
props: {
|
|
labelTr: {
|
|
type: String,
|
|
required: true,
|
|
},
|
|
value: {
|
|
type: Number,
|
|
required: false,
|
|
},
|
|
tooltipTr: {
|
|
type: String,
|
|
required: true,
|
|
},
|
|
width: {
|
|
type: Number,
|
|
required: false,
|
|
default: 10
|
|
},
|
|
min: {
|
|
type: Number,
|
|
required: false
|
|
},
|
|
max: {
|
|
type: Number,
|
|
required: false
|
|
},
|
|
disabled: {
|
|
type: Boolean,
|
|
required: false,
|
|
default: false
|
|
}
|
|
},
|
|
methods: {
|
|
updateValue(value) {
|
|
this.$emit("input", parseInt(value));
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style scoped>
|
|
label {
|
|
display: block;
|
|
}
|
|
|
|
label>span {
|
|
display: inline-block;
|
|
}
|
|
|
|
input {
|
|
margin-left: 0.5em;
|
|
}
|
|
</style>
|