tailbone/tailbone/static/js/tailbone.buefy.numericinput.js
Lance Edgar 3a53ffcc23 Add NumericInputWidget for use with Buefy themes
uses a Vue.js component for better logic encapsulation
2019-06-28 13:06:43 -05:00

38 lines
844 B
JavaScript

const NumericInput = {
template: [
'<b-input',
':name="name"',
':value="value"',
'@keydown.native="keyDown"',
'@input="valueChanged"',
'>',
'</b-input>'
].join(' '),
props: {
name: String,
value: String,
allowEnter: Boolean
},
methods: {
keyDown(event) {
// by default we only allow numeric keys, and general navigation
// keys, but we might also allow Enter key
if (!key_modifies(event) && !key_allowed(event)) {
if (!this.allowEnter || event.which != 13) {
event.preventDefault()
}
}
},
valueChanged(value) {
this.$emit('input', value)
}
}
}
Vue.component('numeric-input', NumericInput)