mirror of https://github.com/nocodb/nocodb
github-actions[bot]
3 years ago
committed by
GitHub
79 changed files with 54535 additions and 662 deletions
@ -1,94 +0,0 @@
|
||||
<template> |
||||
<v-menu bottom offset-y> |
||||
<template #activator="{on}"> |
||||
<transition name="announcement"> |
||||
<v-btn |
||||
v-show="announcementAlert" |
||||
text |
||||
small |
||||
class="mb-0 mr-2 py-0 " |
||||
v-on="on" |
||||
> |
||||
Announcement |
||||
<v-icon small> |
||||
mdi-menu-down |
||||
</v-icon> |
||||
</v-btn> |
||||
</transition> |
||||
</template> |
||||
<v-list dense> |
||||
<v-list-item dense> |
||||
<span class="message"> |
||||
Starting from v0.90, <br/> |
||||
our API will undergo changes <br/> |
||||
and we are discontinuing GraphQL |
||||
</span> |
||||
</v-list-item> |
||||
<v-list-item dense href="https://github.com/nocodb/nocodb/issues/1564" target="_blank"> |
||||
<v-icon small class="mr-2"> |
||||
mdi-script-text-outline |
||||
</v-icon> |
||||
<span class="caption"> |
||||
v0.90.0 API Changes |
||||
</span> |
||||
</v-list-item> |
||||
<v-list-item dense href="https://github.com/nocodb/nocodb/releases/tag/0.90.0" target="_blank"> |
||||
<v-icon small class="mr-2"> |
||||
mdi-script-text-outline |
||||
</v-icon> |
||||
<span class="caption"> |
||||
v0.90.0 Release Note |
||||
</span> |
||||
</v-list-item> |
||||
<v-list-item @click="announcementAlert = false"> |
||||
<v-icon small class="mr-2"> |
||||
mdi-close |
||||
</v-icon> |
||||
<span class="caption"> |
||||
<!--Hide menu--> |
||||
{{ $t('general.hideMenu') }} |
||||
</span> |
||||
</v-list-item> |
||||
</v-list> |
||||
</v-menu> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
name: 'ImportantAnnouncement', |
||||
data: () => ({ |
||||
loading: true |
||||
}), |
||||
computed: { |
||||
announcementAlert: { |
||||
get() { |
||||
return !this.loading && !this.$store.state.app.hiddenAnnouncement |
||||
}, |
||||
set(val) { |
||||
return this.$store.commit('app/MutHiddenAnnouncement', val ? null : true) |
||||
} |
||||
} |
||||
}, |
||||
mounted() { |
||||
setTimeout(() => { |
||||
this.loading = false |
||||
}, 1000) |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped> |
||||
.announcement-enter-active, .announcement-leave-active { |
||||
transition: opacity .5s; |
||||
} |
||||
|
||||
.announcement-enter, .announcement-leave-to { |
||||
opacity: 0; |
||||
} |
||||
|
||||
.message { |
||||
font-size: 0.80rem !important; |
||||
font-weight: bold; |
||||
margin: 10px; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,124 @@
|
||||
<template> |
||||
<div class="color-picker"> |
||||
<div |
||||
v-for="colId in Math.ceil(colors.length / rowSize)" |
||||
:key="colId" |
||||
class="color-picker-row" |
||||
> |
||||
<button |
||||
v-for="(color, i) in colors.slice((colId - 1) * rowSize, (colId) * rowSize)" |
||||
:key="`color-${colId}-${i}`" |
||||
class="color-selector" |
||||
:class="compare(picked, color) ? 'selected':''" |
||||
:style="{ 'background-color': color }" |
||||
@click="select(color)" |
||||
> |
||||
{{ compare(picked, color) ? '✓':'' }} |
||||
</button> |
||||
</div> |
||||
<v-expansion-panels v-if="advanced"> |
||||
<v-expansion-panel> |
||||
<v-expansion-panel-header>Advanced</v-expansion-panel-header> |
||||
<v-expansion-panel-content> |
||||
<v-container class="d-flex flex-column"> |
||||
<v-btn class="primary lighten-2" @click="select(picked)"> |
||||
Pick Color |
||||
</v-btn> |
||||
<v-color-picker |
||||
v-model="picked" |
||||
class="align-self-center ma-2" |
||||
canvas-height="100px" |
||||
mode="hexa" |
||||
/> |
||||
</v-container> |
||||
</v-expansion-panel-content> |
||||
</v-expansion-panel> |
||||
</v-expansion-panels> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
import { enumColor } from '@/components/project/spreadsheet/helpers/colors' |
||||
|
||||
export default { |
||||
name: 'ColorPicker', |
||||
props: { |
||||
value: { |
||||
type: String, |
||||
default: () => enumColor.light[0] |
||||
}, |
||||
colors: { |
||||
type: Array, |
||||
default: () => enumColor.light.concat(enumColor.dark) |
||||
}, |
||||
rowSize: { |
||||
type: Number, |
||||
default: () => 10 |
||||
}, |
||||
advanced: { |
||||
type: Boolean, |
||||
default: () => true |
||||
} |
||||
}, |
||||
data: () => ({ |
||||
picked: '' |
||||
}), |
||||
created() { |
||||
this.picked = this.value || '' |
||||
}, |
||||
methods: { |
||||
select(color) { |
||||
this.picked = color |
||||
this.$emit('input', color) |
||||
}, |
||||
compare(colorA, colorB) { |
||||
if ((typeof colorA === 'string' || colorA instanceof String) && |
||||
(typeof colorB === 'string' || colorB instanceof String)) { |
||||
return colorA.toLowerCase() === colorB.toLowerCase() |
||||
} |
||||
return false |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped> |
||||
.color-picker { |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
flex-direction: column; |
||||
background: white; |
||||
padding: 10px; |
||||
} |
||||
|
||||
.color-picker-row { |
||||
display: flex; |
||||
flex-direction: row; |
||||
} |
||||
|
||||
.color-selector { |
||||
position: relative; |
||||
height: 32px; |
||||
width: 32px; |
||||
margin: 10px 5px; |
||||
border-radius: 5px; |
||||
-webkit-text-stroke-width: 1px; |
||||
-webkit-text-stroke-color: white; |
||||
} |
||||
|
||||
.color-selector:hover { |
||||
filter: brightness(90%); |
||||
-webkit-filter: brightness(90%); |
||||
} |
||||
|
||||
.color-selector.selected { |
||||
filter: brightness(90%); |
||||
-webkit-filter: brightness(90%); |
||||
} |
||||
|
||||
/deep/ .v-input__control { |
||||
height: auto!important; |
||||
} |
||||
|
||||
</style> |
||||
@ -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.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/>.
|
||||
* |
||||
*/ |
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,5 @@
|
||||
import Validator from 'validator'; |
||||
|
||||
export const customValidators = { |
||||
isCurrency: Validator['isFloat'] |
||||
} |
||||
Loading…
Reference in new issue