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'] |
||||||
|
} |
||||||
File diff suppressed because it is too large
Load Diff
Loading…
Reference in new issue