Merge pull request #2157 from brkcvn/currency-conversion
Currency conversion development for ınovices and Bills page.
This commit is contained in:
commit
a3fc0f5d43
@ -1,14 +1,27 @@
|
||||
<template>
|
||||
<div>
|
||||
{{ conversion }}
|
||||
<div class="d-flex align-items-center justify-content-end mt-3">
|
||||
<span>{{ texts[0] }}</span>
|
||||
<money v-bind="{
|
||||
decimal: this.currencySymbol.decimal_mark,
|
||||
thousands: this.currencySymbol.thousands_separator,
|
||||
prefix: (this.currencySymbol.symbol_first) ? this.currencySymbol.symbol : '',
|
||||
suffix: (!this.currencySymbol.symbol_first) ? this.currencySymbol.symbol : '',
|
||||
precision: parseInt(this.currencySymbol.precision),
|
||||
masked: true
|
||||
}" :value="price" disabled size="5" masked class="disabled-money text-right mr-2 js-conversion-input"></money>
|
||||
<span class="mr-2">{{ currecyCode }} {{ texts[2] }}</span>
|
||||
<input name="currency_rate" v-model="rate" @input="onChange" class="form-control text-right mwpx-100 h-auto js-conversion-input" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Vue from 'vue';
|
||||
import {Money} from 'v-money';
|
||||
|
||||
export default {
|
||||
name: 'akaunting-currency-conversion',
|
||||
components: {
|
||||
Money
|
||||
},
|
||||
|
||||
props: {
|
||||
currencyConversionText: {
|
||||
@ -26,33 +39,52 @@ export default {
|
||||
currencyRate: {
|
||||
default: 1.000,
|
||||
},
|
||||
currencySymbol: {
|
||||
default: {}
|
||||
}
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
conversion: '',
|
||||
rate: this.currencyRate,
|
||||
texts: []
|
||||
};
|
||||
},
|
||||
|
||||
created() {
|
||||
this.conversion = this.currencyConversionText.replace(':price', this.price).replace(':currency_code', this.currecyCode).replace(':currency_rate', this.currencyRate);
|
||||
let conver = this.currencyConversionText.split(':price');
|
||||
|
||||
this.texts.push(conver[0]);
|
||||
this.texts.push(conver[1].replace(':currency_code', this.currecyCode).replace(':currency_rate', this.currencyRate));
|
||||
this.texts.push(this.texts[1].split(" ")[2])
|
||||
},
|
||||
|
||||
methods: {
|
||||
onChange() {
|
||||
this.$emit('change', this.rate);
|
||||
}
|
||||
},
|
||||
|
||||
watch: {
|
||||
currencyConversionText: function (text) {
|
||||
this.conversion = text.replace(':price', this.price).replace(':currency_code', this.currecyCode).replace('', this.currencyRate);
|
||||
this.conversion = text.replace(':price', this.price).replace(':currency_code', this.currecyCode);
|
||||
},
|
||||
|
||||
price: function (price) {
|
||||
this.conversion = this.currencyConversionText.replace(':price', price).replace(':currency_code', this.currecyCode).replace(':currency_rate', this.currencyRate);
|
||||
this.conversion = this.currencyConversionText.replace(':price', price).replace(':currency_code', this.currecyCode).replace(':currency_rate', '');
|
||||
},
|
||||
|
||||
currecyCode: function (currecyCode) {
|
||||
this.conversion = this.currencyConversionText.replace(':price', this.price).replace(':currency_code', currecyCode).replace(':currency_rate', this.currencyRate);
|
||||
this.conversion = this.currencyConversionText.replace(':price', this.price).replace(':currency_code', this.currecyCode).replace(':currency_rate', '');
|
||||
},
|
||||
|
||||
currencyRate: function (currencyRate) {
|
||||
this.conversion = this.currencyConversionText.replace(':price', this.price).replace(':currency_code', this.currecyCode).replace(':currency_rate', currencyRate);
|
||||
this.rate = currencyRate;
|
||||
this.conversion = this.currencyConversionText.replace(':price', this.price).replace(':currency_code', this.currecyCode).replace(':currency_rate', '');
|
||||
},
|
||||
currencySymbol: function (currencySymbol) {
|
||||
this.conversion = this.currencyConversionText.replace(':price', this.price).replace(':currency_code', this.currecyCode).replace(':currency_rate', '');
|
||||
},
|
||||
},
|
||||
};
|
||||
|
25
resources/assets/js/views/common/documents.js
vendored
25
resources/assets/js/views/common/documents.js
vendored
@ -55,6 +55,16 @@
|
||||
page_loaded: false,
|
||||
currencies: [],
|
||||
min_due_date: false,
|
||||
currency_symbol: {
|
||||
"name":"US Dollar",
|
||||
"code":"USD",
|
||||
"rate":1,
|
||||
"precision":2,
|
||||
"symbol":"$",
|
||||
"symbol_first":1,
|
||||
"decimal_mark":".",
|
||||
"thousands_separator":","
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
@ -236,6 +246,7 @@
|
||||
}
|
||||
}
|
||||
}, this);
|
||||
this.currencyConversion();
|
||||
},
|
||||
|
||||
calculateTotalsTax(totals_taxes, id, name, price) {
|
||||
@ -542,6 +553,9 @@
|
||||
|
||||
this.form.currency_code = currency.code;
|
||||
this.form.currency_rate = currency.rate;
|
||||
this.currency_symbol = currency;
|
||||
|
||||
this.currencyConversion();
|
||||
}
|
||||
}, this);
|
||||
},
|
||||
@ -549,6 +563,17 @@
|
||||
setDueMinDate(date) {
|
||||
this.min_due_date = date;
|
||||
},
|
||||
|
||||
currencyConversion() {
|
||||
setTimeout(() => {
|
||||
if(document.querySelectorAll('.js-conversion-input')) {
|
||||
let currency_input = document.querySelectorAll('.js-conversion-input');
|
||||
for(let input of currency_input) {
|
||||
input.setAttribute('size', input.value.length);
|
||||
}
|
||||
}
|
||||
}, 250)
|
||||
}
|
||||
},
|
||||
|
||||
created() {
|
||||
|
@ -137,8 +137,10 @@
|
||||
<akaunting-currency-conversion
|
||||
currency-conversion-text="{{ trans('currencies.conversion') }}"
|
||||
:price="(totals.total / form.currency_rate).toFixed(2)"
|
||||
currecy-code="{{ $currency->code }}"
|
||||
:currecy-code="form.currency_code"
|
||||
:currency-rate="form.currency_rate"
|
||||
:currency-symbol="currency_symbol"
|
||||
@change="form.currency_rate = $event"
|
||||
></akaunting-currency-conversion>
|
||||
</td>
|
||||
<td class="border-top-0 pt-0 pb-0" style="max-width: 50px"></td>
|
||||
|
Loading…
x
Reference in New Issue
Block a user