github/directus
1
0
Fork 0
mirror of https://github.com/directus/directus.git synced 2026-02-18 06:11:26 -05:00
Code Issues Packages Projects Releases Wiki Activity

allow for custom formats

Browse Source
This commit is contained in:
Nitwel
2020-10-20 13:25:36 +02:00
parent 24da502089
commit dbcae8324b
4 changed files with 42 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
app/src/displays/datetime/datetime.vue
View File

@@ -20,6 +20,10 @@ export default defineComponent({
required: true,
validator: (val: string) => ['dateTime', 'date', 'time', 'timestamp'].includes(val),
},
format: {
type: String,
default: 'long',
},
relative: {
type: Boolean,
default: false,
@@ -57,9 +61,18 @@ export default defineComponent({
addSuffix: true,
});
} else {
let format = `${i18n.t('date-fns_date')} ${i18n.t('date-fns_time')}`;
if (props.type === 'date') format = String(i18n.t('date-fns_date'));
if (props.type === 'time') format = String(i18n.t('date-fns_time'));
let format;
if (props.format === 'long') {
format = `${i18n.t('date-fns_date')} ${i18n.t('date-fns_time')}`;
if (props.type === 'date') format = String(i18n.t('date-fns_date'));
if (props.type === 'time') format = String(i18n.t('date-fns_time'));
} else if (props.format === 'short') {
format = `${i18n.t('date-fns_date_short')} ${i18n.t('date-fns_time_short')}`;
if (props.type === 'date') format = String(i18n.t('date-fns_date_short'));
if (props.type === 'time') format = String(i18n.t('date-fns_time_short'));
} else {
format = props.format;
}
displayValue.value = await localizedFormat(newValue, format);
}

21
app/src/displays/datetime/index.ts
View File

@@ -8,11 +8,32 @@ export default defineDisplay(({ i18n }) => ({
icon: 'query_builder',
handler: DisplayDateTime,
options: [
{
field: 'format',
name: i18n.t('displays.datetime.format'),
type: 'string',
meta: {
interface: 'dropdown',
width: 'half',
options: {
choices: [
{ text: i18n.t('displays.datetime.long'), value: 'long' },
{ text: i18n.t('displays.datetime.short'), value: 'short' },
],
allowOther: true,
},
note: i18n.t('displays.datetime.format_note'),
},
schema: {
default_value: 'long',
},
},
{
field: 'relative',
name: i18n.t('displays.datetime.relative'),
type: 'boolean',
meta: {
width: 'half',
interface: 'toggle',
options: {
label: i18n.t('displays.datetime.relative_label'),