95 lines
2.5 KiB
Vue
95 lines
2.5 KiB
Vue
<template>
|
|
<div>
|
|
<v-text-field
|
|
ref="textField"
|
|
:value="formattedValue"
|
|
@input="handleInput"
|
|
v-currency="{
|
|
currency: currencyName,
|
|
locale: languageName
|
|
}"
|
|
:readonly="readonly"
|
|
v-bind:label="label"
|
|
v-bind:rules="rules"
|
|
v-bind:required="required"
|
|
></v-text-field>
|
|
<p v-show="error" class="form__error v-messages theme--light error--text">
|
|
{{ error }}
|
|
</p>
|
|
<!-- currency:{{ currencyName }}, locale:{{ languageName }}, amount:{{ amount }}
|
|
<span class="title">v-currency-field</span>
|
|
<v-currency-field v-model="value" /> -->
|
|
</div>
|
|
</template>
|
|
<script>
|
|
/* Xeslint-disable */
|
|
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 },
|
|
required: { type: Boolean, default: false },
|
|
readonly: { type: Boolean, default: false },
|
|
error: {
|
|
type: String,
|
|
required: false
|
|
}
|
|
},
|
|
methods: {
|
|
lt(ltKey) {
|
|
return window.$gz.locale.get(ltKey);
|
|
},
|
|
locale() {
|
|
return window.$gz.locale;
|
|
},
|
|
handleInput(value) {
|
|
this.$emit(
|
|
"input",
|
|
parseCurrency(value, {
|
|
currency: this.currencyName,
|
|
locale: this.languageName
|
|
})
|
|
);
|
|
this.formattedValue = value;
|
|
}
|
|
}
|
|
// ,
|
|
// computed: {
|
|
// amountLocal: {
|
|
// get: function() {
|
|
// console.log("Control getting amount: " + this.amount);
|
|
// if (this.amount == null) {
|
|
// return "0";
|
|
// } else {
|
|
// return this.amount.toString();
|
|
// }
|
|
// },
|
|
// set: function(value) {
|
|
// var parsedValue = this.$parseCurrency(this.amount, {
|
|
// currency: this.currencyName,
|
|
// locale: this.languageName
|
|
// });
|
|
// console.log("Control SETTING amount: " + parsedValue);
|
|
// //https://vuejs.org/v2/guide/components-custom-events.html#sync-Modifier
|
|
// //https://stackoverflow.com/a/51722100/8939
|
|
// this.$emit("update:amount", parsedValue);
|
|
// this.$emit("change", parsedValue);
|
|
// }
|
|
// }
|
|
// },
|
|
};
|
|
</script>
|