mirror of https://github.com/nocodb/nocodb
Browse Source
* feat: currency column supporting multiple locales and units Signed-off-by: mertmit <mertmit99@gmail.com> * feat: add default currency locale and code Signed-off-by: mertmit <mertmit99@gmail.com> * feat: change default length and scale for currency Signed-off-by: mertmit <mertmit99@gmail.com> * feat: add proper validations for currency fields Signed-off-by: mertmit <mertmit99@gmail.com> * fix: use UITypes instead of raw uidt Signed-off-by: mertmit <mertmit99@gmail.com> * feat: dropdown for currency properties Signed-off-by: mertmit <mertmit99@gmail.com> * fix: add proper v2 migrations Signed-off-by: mertmit <mertmit99@gmail.com> * fix: add custom validators Signed-off-by: Mert Ersoy <mertmit99@gmail.com> * feat: handle currency data from meta column Signed-off-by: mertmit <mertmit99@gmail.com> * fix: move currency specific options out Signed-off-by: mertmit <mertmit99@gmail.com> * fix: pass colMeta by value instead of reference Signed-off-by: mertmit <mertmit99@gmail.com>pull/2139/head
mertmit
2 years ago
committed by
GitHub
11 changed files with 241 additions and 14 deletions
@ -0,0 +1,37 @@
|
||||
<template> |
||||
<a v-if="value">{{ currency }}</a> |
||||
<span v-else /> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
name: 'CurrencyCell', |
||||
props: { |
||||
column: Object, |
||||
value: [String, Number] |
||||
}, |
||||
computed: { |
||||
currency() { |
||||
try { |
||||
return new Intl.NumberFormat(this.currencyMeta.currency_locale || 'en-US', |
||||
{ style: 'currency', currency: this.currencyMeta.currency_code || 'USD' }).format(this.value) |
||||
} catch (e) { |
||||
return this.value |
||||
} |
||||
}, |
||||
currencyMeta() { |
||||
return { |
||||
currency_locale: 'en-US', |
||||
currency_code: 'USD', |
||||
...(this.column && this.column.meta |
||||
? this.column.meta |
||||
: {}) |
||||
} |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped> |
||||
|
||||
</style> |
||||
@ -0,0 +1,73 @@
|
||||
<template> |
||||
<v-row class="currency-wrapper"> |
||||
<v-col cols="6"> |
||||
<!--label="Format Locale"--> |
||||
<v-autocomplete |
||||
v-model="colMeta.currency_locale" |
||||
dense |
||||
class="caption" |
||||
label="Currency Locale" |
||||
:rules="[isValidCurrencyLocale]" |
||||
:items="currencyLocaleList" |
||||
outlined |
||||
hide-details |
||||
/> |
||||
</v-col> |
||||
<v-col cols="6"> |
||||
<!--label="Currency Code"--> |
||||
<v-autocomplete |
||||
v-model="colMeta.currency_code" |
||||
dense |
||||
class="caption" |
||||
label="Currency Code" |
||||
:rules="[isValidCurrencyCode]" |
||||
:items="currencyList" |
||||
outlined |
||||
hide-details |
||||
/> |
||||
</v-col> |
||||
</v-row> |
||||
</template> |
||||
|
||||
<script> |
||||
import { currencyCodes, currencyLocales, validateCurrencyCode, validateCurrencyLocale } from '~/helpers/currencyHelper' |
||||
|
||||
export default { |
||||
name: 'CurrencyOptions', |
||||
props: ['column', 'meta', 'value'], |
||||
data: () => ({ |
||||
colMeta: { |
||||
currency_locale: 'en-US', |
||||
currency_code: 'USD' |
||||
}, |
||||
currencyList: currencyCodes, |
||||
currencyLocaleList: currencyLocales(), |
||||
isValidCurrencyLocale: (value) => { |
||||
return validateCurrencyLocale(value) || 'Invalid locale' |
||||
}, |
||||
isValidCurrencyCode: (value) => { |
||||
return validateCurrencyCode(value) || 'Invalid Currency Code' |
||||
} |
||||
}), |
||||
watch: { |
||||
value() { |
||||
this.colMeta = this.value || {} |
||||
}, |
||||
colMeta(v) { |
||||
this.$emit('input', v) |
||||
} |
||||
}, |
||||
created() { |
||||
this.colMeta = { ...this.value } || { ...this.colMeta } |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped> |
||||
.currency-wrapper { |
||||
margin: 0; |
||||
} |
||||
/deep/ .v-input__append-inner { |
||||
margin-top: 4px !important; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,82 @@
|
||||
import locale from 'locale-codes' |
||||
|
||||
export const currencyCodes = [ |
||||
'AED', 'AFN', 'ALL', 'AMD', 'ANG', 'AOA', 'ARS', 'AUD', |
||||
'AWG', 'AZN', 'BAM', 'BBD', 'BDT', 'BGN', 'BHD', 'BIF', |
||||
'BMD', 'BND', 'BOB', 'BOV', 'BRL', 'BSD', 'BTN', 'BWP', |
||||
'BYR', 'BZD', 'CAD', 'CDF', 'CHE', 'CHF', 'CHW', 'CLF', |
||||
'CLP', 'CNY', 'COP', 'COU', 'CRC', 'CUP', 'CVE', 'CYP', |
||||
'CZK', 'DJF', 'DKK', 'DOP', 'DZD', 'EEK', 'EGP', 'ERN', |
||||
'ETB', 'EUR', 'FJD', 'FKP', 'GBP', 'GEL', 'GHC', 'GIP', |
||||
'GMD', 'GNF', 'GTQ', 'GYD', 'HKD', 'HNL', 'HRK', 'HTG', |
||||
'HUF', 'IDR', 'ILS', 'INR', 'IQD', 'IRR', 'ISK', 'JMD', |
||||
'JOD', 'JPY', 'KES', 'KGS', 'KHR', 'KMF', 'KPW', 'KRW', |
||||
'KWD', 'KYD', 'KZT', 'LAK', 'LBP', 'LKR', 'LRD', 'LSL', |
||||
'LTL', 'LVL', 'LYD', 'MAD', 'MDL', 'MGA', 'MKD', 'MMK', |
||||
'MNT', 'MOP', 'MRO', 'MTL', 'MUR', 'MVR', 'MWK', 'MXN', |
||||
'MXV', 'MYR', 'MZN', 'NAD', 'NGN', 'NIO', 'NOK', 'NPR', |
||||
'NZD', 'OMR', 'PAB', 'PEN', 'PGK', 'PHP', 'PKR', 'PLN', |
||||
'PYG', 'QAR', 'ROL', 'RON', 'RSD', 'RUB', 'RWF', 'SAR', |
||||
'SBD', 'SCR', 'SDD', 'SEK', 'SGD', 'SHP', 'SIT', 'SKK', |
||||
'SLL', 'SOS', 'SRD', 'STD', 'SYP', 'SZL', 'THB', 'TJS', |
||||
'TMM', 'TND', 'TOP', 'TRY', 'TTD', 'TWD', 'TZS', 'UAH', |
||||
'UGX', 'USD', 'USN', 'USS', 'UYU', 'UZS', 'VEB', 'VND', |
||||
'VUV', 'WST', 'XAF', 'XAG', 'XAU', 'XBA', 'XBB', 'XBC', |
||||
'XBD', 'XCD', 'XDR', 'XFO', 'XFU', 'XOF', 'XPD', 'XPF', |
||||
'XPT', 'XTS', 'XXX', 'YER', 'ZAR', 'ZMK', 'ZWD' |
||||
] |
||||
|
||||
export function validateCurrencyCode(v) { |
||||
return currencyCodes.includes(v) |
||||
} |
||||
|
||||
export function currencyLocales() { |
||||
const localeList = locale.all |
||||
.filter((l) => { |
||||
try { |
||||
if (Intl.NumberFormat.supportedLocalesOf(l.tag).length > 0) { |
||||
return true |
||||
} |
||||
return false |
||||
} catch (e) { |
||||
return false |
||||
} |
||||
}) |
||||
.map((l) => { |
||||
return { |
||||
text: l.name + ' (' + l.tag + ')', |
||||
value: l.tag |
||||
} |
||||
}) |
||||
return localeList |
||||
} |
||||
|
||||
export function validateCurrencyLocale(v) { |
||||
try { |
||||
return Intl.NumberFormat.supportedLocalesOf(v).length > 0 |
||||
} catch (e) { |
||||
return false |
||||
} |
||||
} |
||||
|
||||
/** |
||||
* @copyright Copyright (c) 2021, Xgene Cloud Ltd |
||||
* |
||||
* @author Mert Ersoy <mertmit99@gmail.com> |
||||
* |
||||
* @license GNU AGPL version 3 or any later version |
||||
* |
||||
* This program is free software: you can redistribute it and/or modify |
||||
* it under the terms of the GNU Affero General Public License as |
||||
* published by the Free Software Foundation, either version 3 of the |
||||
* License, or (at your option) any later version. |
||||
* |
||||
* This program is distributed in the hope that it will be useful, |
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of |
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the |
||||
* GNU Affero General Public License for more details. |
||||
* |
||||
* You should have received a copy of the GNU Affero General Public License |
||||
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
* |
||||
*/ |
||||
Loading…
Reference in new issue