This commit is contained in:
2019-02-26 20:13:40 +00:00
parent 4eaf804d7c
commit f6f4edf562
3 changed files with 42 additions and 46 deletions

View File

@@ -21,6 +21,7 @@ OK, I can make it display and take entry the way I want, but
- Value comes back as text, I need to parse it whatever the case - Value comes back as text, I need to parse it whatever the case
Maybe I can just allow free form entry and handle parsing, display in my own code?? Maybe I can just allow free form entry and handle parsing, display in my own code??
What about native components instead??
Find out how to do a currency and other types of numeric input Find out how to do a currency and other types of numeric input
Make the currency and numeric fields work, then do the next stuff below: Make the currency and numeric fields work, then do the next stuff below:

View File

@@ -54,5 +54,12 @@ export default {
"WikiPage", "WikiPage",
"Duplicate", "Duplicate",
"RecordHistory" "RecordHistory"
] ],
decimalValidate(required) {
return { required: required, decimal: [2, this.formats.decimalSeparator] };
},
formats: {
decimalSeparator: "#",
currencySymbol: "CA$"
}
}; };

View File

@@ -39,25 +39,15 @@
<v-flex xs12 sm6 lg4 xl3 px-2> <v-flex xs12 sm6 lg4 xl3 px-2>
<v-text-field <v-text-field
v-model="obj.dollarAmount" v-model="obj.dollarAmount"
:prefix="locale.currencySymbol" :prefix="lc.formats.currencySymbol"
v-validate="{ required: true, decimal: [2, ','] }" v-validate="lc.decimalValidate(true)"
:error-messages="errors.collect('dollarAmount')" :error-messages="errors.collect('dollarAmount')"
label="Dollar amount" :label="lc.get('WidgetDollarAmount')"
data-vv-name="dollarAmount" data-vv-name="dollarAmount"
required required
></v-text-field> ></v-text-field>
</v-flex> </v-flex>
<v-flex xs12 sm6 lg4 xl3 px-2> <!-- v-validate="localDecimalValidate()" -->
<v-text-field
v-model="obj.dollarAmount2"
:prefix="localeCurrencySymbol()"
:v-validate="{ required: true, decimal: [2, localeDecimalSeparator()] }"
:error-messages="errors.collect('dollarAmount2')"
label="Dollar amount2"
data-vv-name="dollarAmount2"
required
></v-text-field>
</v-flex>
<!-- <v-flex xs12 sm6 lg4 xl3 px-2> <!-- <v-flex xs12 sm6 lg4 xl3 px-2>
<v-select <v-select
v-model="select" v-model="select"
@@ -68,7 +58,7 @@
data-vv-name="select" data-vv-name="select"
required required
></v-select> ></v-select>
</v-flex> --> </v-flex>-->
<v-flex xs12 sm6 lg4 xl3 px-2> <v-flex xs12 sm6 lg4 xl3 px-2>
<v-checkbox <v-checkbox
v-model="obj.active" v-model="obj.active"
@@ -82,7 +72,7 @@
</v-flex> </v-flex>
</v-layout> </v-layout>
<v-layout align-center justify-space-around row wrap mt-5> <v-layout align-center justify-space-around row wrap mt-5>
<v-flex xs1> <v-flex xs1>
<v-btn @click="test">TEST</v-btn> <v-btn @click="test">TEST</v-btn>
</v-flex> </v-flex>
<v-flex xs1> <v-flex xs1>
@@ -101,7 +91,7 @@
/* eslint-disable */ /* eslint-disable */
// type="checkbox" // type="checkbox"
//import store from "../store"; //import store from "../store";
import lt from "../api/locale"; import locale from "../api/locale";
//import _ from "../utils/libs/lodash.js"; //import _ from "../utils/libs/lodash.js";
export default { export default {
components: {}, components: {},
@@ -114,7 +104,8 @@ export default {
name: "Fantastic Wooden Chips 122", name: "Fantastic Wooden Chips 122",
serial: 100, serial: 100,
dollarAmount: 584.83, dollarAmount: 584.83,
dollarAmount2: 123.56, dollarAmount2: 987.65,
dollarAmount3: 123.45,
active: true, active: true,
roles: 8212, roles: 8212,
startDate: "2019-02-12T10:12:39.594206", startDate: "2019-02-12T10:12:39.594206",
@@ -125,12 +116,8 @@ export default {
customFields: null, customFields: null,
tags: ["brown", "red"] tags: ["brown", "red"]
}, },
locale:{ lc: locale
currencySymbol: "CAD", };
decimalSeparator: "*"
}
};
}, },
beforeRouteEnter(to, from, next) { beforeRouteEnter(to, from, next) {
//Cache all required lt keys //Cache all required lt keys
@@ -160,39 +147,40 @@ export default {
"WidgetCustom14", "WidgetCustom14",
"WidgetCustom15", "WidgetCustom15",
"WidgetCustom16" "WidgetCustom16"
].concat(lt.commonKeysEditForm); ].concat(locale.commonKeysEditForm);
lt.fetch(ltKeysRequired).then(() => { locale.fetch(ltKeysRequired).then(() => {
next(); next();
}); });
}, },
mounted() {}, mounted() {
//debugger;
},
methods: { methods: {
lt: function(key) { // t: function(key) {
return lt.get(key); // return locale.get(key);
}, // },
// lc: function() {
// return locale;
// },
// localDecimalValidate: function() {
// return locale.decimalValidate(true);
// //return { required: true, decimal: [2, locale.formats.decimalSeparator] };
// },
submit() { submit() {
//alert("VALIDATING>>>"); //alert("VALIDATING>>>");
debugger; debugger;
console.log(obj.dollarAmount2); console.log(obj.dollarAmount2);
alert(obj.dollarAmount2); alert(obj.dollarAmount2);
this.$validator.validateAll(); this.$validator.validateAll();
}, },
localeDecimalSeparator(){ clear() {
debugger; debugger;
return ','; console.log(this.data().obj.dollarAmount);
alert(data().obj.dollarAmount);
}, },
localeCurrencySymbol(){ test() {
return 'Eur'; //debugger;
}, console.log(this.obj.dollarAmount);
clear(){
debugger;
console.log(this.data().obj.dollarAmount2);
alert(data().obj.dollarAmount2);
},
test(){
console.log(this.obj.dollarAmount2);
debugger;
} }
} }
}; };