John Cardinal
b9fa360d33
renamed onChange handler code to better reflect what it does tested all controls on widget form to ensure they update and roundtrip properly and dirty checking is now fired immediately no need to tab off
67 lines
1.6 KiB
Vue
67 lines
1.6 KiB
Vue
<template>
|
|
<div>
|
|
<v-text-field
|
|
ref="textField"
|
|
:value="formattedValue"
|
|
@input="handleInput"
|
|
v-currency="{
|
|
currency: currencyName,
|
|
locale: languageName
|
|
}"
|
|
:readonly="readonly"
|
|
:label="label"
|
|
:rules="rules"
|
|
></v-text-field>
|
|
<p v-show="error" class="form__error v-messages theme--light error--text">
|
|
{{ error }}
|
|
</p>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
/* Xeslint-disable */
|
|
//https://dm4t2.github.io/vue-currency-input/guide/#introduction
|
|
//https://codesandbox.io/s/vue-template-kd7d1?fontsize=14&module=%2Fsrc%2FApp.vue
|
|
//https://github.com/dm4t2/vue-currency-input
|
|
import { setValue, parseCurrency } from "vue-currency-input";
|
|
export default {
|
|
data() {
|
|
return {
|
|
formattedValue: this.value,
|
|
currencyName: window.$gz.locale.getCurrencyName(),
|
|
languageName: window.$gz.locale.getBrowserFirstLanguage()
|
|
};
|
|
},
|
|
watch: {
|
|
value(value) {
|
|
setValue(this.$refs.textField.$refs.input, value);
|
|
}
|
|
},
|
|
props: {
|
|
label: String,
|
|
rules: Array,
|
|
value: { type: Number, default: null },
|
|
readonly: { type: Boolean, default: false },
|
|
error: {
|
|
type: String,
|
|
required: false
|
|
}
|
|
},
|
|
methods: {
|
|
lt(ltKey) {
|
|
return window.$gz.translation.get(ltKey);
|
|
},
|
|
translation() {
|
|
return window.$gz.translation;
|
|
},
|
|
handleInput(value) {
|
|
var ret = parseCurrency(value, {
|
|
currency: this.currencyName,
|
|
locale: this.languageName
|
|
});
|
|
this.$emit("input", ret);
|
|
this.formattedValue = value;
|
|
}
|
|
}
|
|
};
|
|
</script>
|