mirror of https://github.com/nocodb/nocodb
Wing-Kam Wong
2 years ago
13 changed files with 438 additions and 9 deletions
@ -0,0 +1,100 @@
|
||||
<script setup lang="ts"> |
||||
import { useColumnCreateStoreOrThrow, useProject } from '#imports' |
||||
import { currencyCodes, currencyLocales, validateCurrencyCode, validateCurrencyLocale } from '@/utils' |
||||
|
||||
interface Option { |
||||
label: string |
||||
value: string |
||||
} |
||||
|
||||
const { formState, validateInfos, setAdditionalValidations, sqlUi, onDataTypeChange, onAlter } = useColumnCreateStoreOrThrow() |
||||
|
||||
const validators = { |
||||
'meta.currency_locale': [ |
||||
{ |
||||
validator: (_: any, locale: any) => { |
||||
return new Promise<void>((resolve, reject) => { |
||||
if (!validateCurrencyLocale(locale)) { |
||||
return reject(new Error('Invalid locale')) |
||||
} |
||||
resolve() |
||||
}) |
||||
}, |
||||
}, |
||||
], |
||||
'meta.currency_code': [ |
||||
{ |
||||
validator: (_: any, currencyCode: any) => { |
||||
return new Promise<void>((resolve, reject) => { |
||||
if (!validateCurrencyCode(currencyCode)) { |
||||
return reject(new Error('Invalid Currency Code')) |
||||
} |
||||
resolve() |
||||
}) |
||||
}, |
||||
}, |
||||
], |
||||
} |
||||
|
||||
// set additional validations |
||||
setAdditionalValidations({ |
||||
...validators, |
||||
}) |
||||
|
||||
const { isPg } = useProject() |
||||
|
||||
const currencyList = currencyCodes || [] |
||||
|
||||
const currencyLocaleList = currencyLocales() || [] |
||||
|
||||
const isMoney = computed(() => formState.value.dt === 'money') |
||||
|
||||
const message = computed(() => { |
||||
if (isMoney.value && isPg) return "PostgreSQL 'money' type has own currency settings" |
||||
return '' |
||||
}) |
||||
|
||||
function filterOption(input: string, option: Option) { |
||||
return option.value.toUpperCase().includes(input.toUpperCase()) |
||||
} |
||||
</script> |
||||
|
||||
<template> |
||||
<a-row> |
||||
<a-col :span="12"> |
||||
<a-form-item v-bind="validateInfos['meta.currency_locale']" label="Currency Locale"> |
||||
<a-select |
||||
v-model:value="formState.meta.currency_locale" |
||||
size="small" |
||||
class="w-52" |
||||
show-search |
||||
:filter-option="filterOption" |
||||
:disabled="isMoney && isPg" |
||||
> |
||||
<a-select-option v-for="(currencyLocale, i) of currencyLocaleList" :key="i" :value="currencyLocale.value"> |
||||
{{ currencyLocale.text }} |
||||
</a-select-option> |
||||
</a-select> |
||||
</a-form-item> |
||||
</a-col> |
||||
<a-col :span="12"> |
||||
<a-form-item v-bind="validateInfos['meta.currency_code']" label="Currency Code"> |
||||
<a-select |
||||
v-model:value="formState.meta.currency_code" |
||||
class="w-52" |
||||
show-search |
||||
:filter-option="filterOption" |
||||
size="small" |
||||
:disabled="isMoney && isPg" |
||||
> |
||||
<a-select-option v-for="(currencyCode, i) of currencyList" :key="i" :value="currencyCode"> |
||||
{{ currencyCode }} |
||||
</a-select-option> |
||||
</a-select> |
||||
</a-form-item> |
||||
</a-col> |
||||
<a-col v-if="isMoney && isPg"> |
||||
<span class="text-[#FB8C00]">{{ message }}</span> |
||||
</a-col> |
||||
</a-row> |
||||
</template> |
||||
@ -0,0 +1,30 @@
|
||||
<script setup lang="ts"> |
||||
import { useColumnCreateStoreOrThrow } from '#imports' |
||||
import { durationOptions } from '@/utils' |
||||
|
||||
const { formState, validateInfos, setAdditionalValidations, sqlUi, onDataTypeChange, onAlter } = useColumnCreateStoreOrThrow() |
||||
|
||||
const durationOptionList = |
||||
durationOptions.map((o) => ({ |
||||
...o, |
||||
// h:mm:ss (e.g. 3:45, 1:23:40) |
||||
title: `${o.title} ${o.example}`, |
||||
})) || [] |
||||
</script> |
||||
|
||||
<template> |
||||
<a-row> |
||||
<a-col :span="24"> |
||||
<span class="prose-sm mt-2">A duration of time in minutes or seconds (e.g. 1:23).</span> |
||||
</a-col> |
||||
<a-col :span="24"> |
||||
<a-form-item label="Duration Format"> |
||||
<a-select v-model:value="formState.meta.duration" size="small" class="w-52"> |
||||
<a-select-option v-for="(duration, i) of durationOptionList" :key="i" :value="duration.id"> |
||||
{{ duration.title }} |
||||
</a-select-option> |
||||
</a-select> |
||||
</a-form-item> |
||||
</a-col> |
||||
</a-row> |
||||
</template> |
||||
@ -0,0 +1,220 @@
|
||||
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: string) { |
||||
return currencyCodes.includes(v) |
||||
} |
||||
|
||||
export function currencyLocales() { |
||||
const localeList = locale.all |
||||
.filter((l: Record<string, any>) => { |
||||
try { |
||||
if (Intl.NumberFormat.supportedLocalesOf(l.tag).length > 0) { |
||||
return true |
||||
} |
||||
return false |
||||
} catch (e) { |
||||
return false |
||||
} |
||||
}) |
||||
.map((l: Record<string, any>) => { |
||||
return { |
||||
text: `${l.name} (${l.tag})`, |
||||
value: l.tag, |
||||
} |
||||
}) |
||||
return localeList |
||||
} |
||||
|
||||
export function validateCurrencyLocale(v: string) { |
||||
try { |
||||
return Intl.NumberFormat.supportedLocalesOf(v).length > 0 |
||||
} catch (e) { |
||||
return false |
||||
} |
||||
} |
||||
Loading…
Reference in new issue