diff --git a/frontend/app/features/content/pages/contents/contents-page.component.html b/frontend/app/features/content/pages/contents/contents-page.component.html index bb6676758..1508ec411 100644 --- a/frontend/app/features/content/pages/contents/contents-page.component.html +++ b/frontend/app/features/content/pages/contents/contents-page.component.html @@ -15,7 +15,7 @@
-
- diff --git a/frontend/app/framework/angular/forms/date-time-editor.component.html b/frontend/app/framework/angular/forms/date-time-editor.component.html index 9fdc867e5..5afd0a623 100644 --- a/frontend/app/framework/angular/forms/date-time-editor.component.html +++ b/frontend/app/framework/angular/forms/date-time-editor.component.html @@ -13,12 +13,12 @@
-
+
-
+
diff --git a/frontend/app/framework/angular/forms/date-time-editor.component.ts b/frontend/app/framework/angular/forms/date-time-editor.component.ts index 9bb161826..0070ddb2a 100644 --- a/frontend/app/framework/angular/forms/date-time-editor.component.ts +++ b/frontend/app/framework/angular/forms/date-time-editor.component.ts @@ -36,6 +36,7 @@ export class DateTimeEditorComponent extends StatefulControlComponent<{}, string private picker: any; private timeValue: moment.Moment | null = null; private dateValue: moment.Moment | null = null; + private hideDateButtonsSettings: boolean; private suppressEvents = false; @Input() @@ -47,13 +48,18 @@ export class DateTimeEditorComponent extends StatefulControlComponent<{}, string @Input() public hideClear: boolean; + @Input() + public hideDateButtons: boolean; + @ViewChild('dateInput', { static: false }) public dateInput: ElementRef; public timeControl = new FormControl(); public dateControl = new FormControl(); - public hideDateButtons: boolean; + public get shouldShowDateButtons() { + return !this.hideDateButtonsSettings && !this.hideDateButtons; + } public get showTime() { return this.mode === 'DateTime'; @@ -66,7 +72,7 @@ export class DateTimeEditorComponent extends StatefulControlComponent<{}, string constructor(changeDetector: ChangeDetectorRef, uiOptions: UIOptions) { super(changeDetector, {}); - this.hideDateButtons = !!uiOptions.get('hideDateButtons'); + this.hideDateButtonsSettings = !!uiOptions.get('hideDateButtons'); } public ngOnInit() { diff --git a/frontend/app/framework/angular/forms/dropdown.component.ts b/frontend/app/framework/angular/forms/dropdown.component.ts index ae0021b82..7d9405ea0 100644 --- a/frontend/app/framework/angular/forms/dropdown.component.ts +++ b/frontend/app/framework/angular/forms/dropdown.component.ts @@ -107,15 +107,11 @@ export class DropdownComponent extends StatefulControlComponent im public ngAfterContentInit() { if (this.templates.length === 1) { - this.templateItem = this.templateSelection = this.templates.first; + this.templateItem = this.templates.first; + this.templateSelection = this.templates.first; } else { - this.templates.forEach(template => { - if (template.name === 'selection') { - this.templateSelection = template; - } else { - this.templateItem = template; - } - }); + this.templateItem = this.templates.first; + this.templateSelection = this.templates.last; } if (this.templateItem) { diff --git a/frontend/app/shared/components/queries/filter-comparison.component.html b/frontend/app/shared/components/queries/filter-comparison.component.html index 9013fc71e..03edc2c9b 100644 --- a/frontend/app/shared/components/queries/filter-comparison.component.html +++ b/frontend/app/shared/components/queries/filter-comparison.component.html @@ -1,15 +1,23 @@
- + + +
{{model.fields[field].displayName}}
+ + {{model.fields[field].description}} +
+ + + {{model.fields[field].displayName}} + +
-
+
-
+
diff --git a/frontend/app/shared/components/queries/filter-comparison.component.scss b/frontend/app/shared/components/queries/filter-comparison.component.scss index ecc51e671..fe19e6460 100644 --- a/frontend/app/shared/components/queries/filter-comparison.component.scss +++ b/frontend/app/shared/components/queries/filter-comparison.component.scss @@ -2,5 +2,9 @@ @import '_mixins'; .path { - max-width: 12rem; + width: 10rem; +} + +.operator { + width: 10rem; } \ No newline at end of file diff --git a/frontend/app/shared/components/queries/sorting.component.ts b/frontend/app/shared/components/queries/sorting.component.ts index 6422ae3b0..3530aac9a 100644 --- a/frontend/app/shared/components/queries/sorting.component.ts +++ b/frontend/app/shared/components/queries/sorting.component.ts @@ -15,11 +15,19 @@ import { QueryModel, QuerySorting } from '@app/shared/internal';
- + + +
{{model.fields[field].displayName}}
+ + {{model.fields[field].description}} +
+ + + {{model.fields[field].displayName}} + +
- diff --git a/frontend/app/shared/components/search-form.component.ts b/frontend/app/shared/components/search-form.component.ts index 80d75f0c1..dd021b3a5 100644 --- a/frontend/app/shared/components/search-form.component.ts +++ b/frontend/app/shared/components/search-form.component.ts @@ -56,7 +56,7 @@ export class SearchFormComponent implements OnChanges { public saveQueryDialog = new DialogModel(); public saveQueryForm = new SaveQueryForm(this.formBuilder); - public searchDialog = new DialogModel(); + public searchDialog = new DialogModel(true); public hasFilter: boolean; diff --git a/frontend/app/shared/state/query.ts b/frontend/app/shared/state/query.ts index 59b450690..5225c7f00 100644 --- a/frontend/app/shared/state/query.ts +++ b/frontend/app/shared/state/query.ts @@ -43,11 +43,19 @@ export interface QueryFieldModel { // Extra values. extra?: any; + + // The optional display name for the field. + displayName?: string; + + // The optional description for the field. + description?: string; } +type QueryModelFields = { [name: string]: QueryFieldModel }; + export interface QueryModel { // All available fields. - fields: { [name: string]: QueryFieldModel }; + fields: QueryModelFields; } export type FilterNode = FilterComparison | FilterLogical; @@ -121,25 +129,25 @@ export function hasFilter(query?: Query) { } const EqualOperators: ReadonlyArray = [ - { name: '==', value: 'eq' }, - { name: '!=', value: 'ne' } + { name: 'is equals to', value: 'eq' }, + { name: 'is not equals to', value: 'ne' } ]; const CompareOperator: ReadonlyArray = [ - { name: '<', value: 'lt' }, - { name: '<=', value: 'le' }, - { name: '>', value: 'gt' }, - { name: '>=', value: 'ge' } + { name: 'is less than', value: 'lt' }, + { name: 'is less than or equals to', value: 'le' }, + { name: 'is greater than', value: 'gt' }, + { name: 'is greater than or equals to', value: 'ge' } ]; const StringOperators: ReadonlyArray = [ - { name: 'T*', value: 'startsWith' }, - { name: '*T', value: 'endsWith' }, - { name: '*T*', value: 'contains' } + { name: 'starts with', value: 'startsWith' }, + { name: 'ends with', value: 'endsWith' }, + { name: 'contains', value: 'contains' } ]; const ArrayOperators: ReadonlyArray = [ - { value: 'empty', noValue: true } + { value: 'is empty', noValue: true } ]; const TypeBoolean: QueryFieldModel = { @@ -177,23 +185,48 @@ const TypeTags: QueryFieldModel = { operators: EqualOperators }; +const DEFAULT_FIELDS: QueryModelFields = { + created: { + ...TypeDateTime, + displayName: 'Created', + description: 'The date time when the content item was created.' + }, + createdBy: { + ...TypeString, + displayName: 'Created by', + description: 'The user who created the content item.' + }, + lastModified: { + ...TypeDateTime, + displayName: 'Updated', + description: 'The date time when the content item was updated the last time.' + }, + lastModifiedBy: { + ...TypeString, + displayName: 'Updated by', + description: 'The user who updated the content item the last time.' + }, + version: { + ...TypeNumber, + displayName: 'Version', + description: 'The version of the content item' + } +}; + export function queryModelFromSchema(schema: SchemaDetailsDto, languages: ReadonlyArray, statuses: ReadonlyArray | undefined) { const languagesCodes = languages.map(x => x.iso2Code); - const invariantCodes = ['iv']; - const model: QueryModel = { - fields: {} + fields: { ...DEFAULT_FIELDS } }; - model.fields['created'] = TypeDateTime; - model.fields['createdBy'] = TypeString; - model.fields['lastModified'] = TypeDateTime; - model.fields['lastModifiedBy'] = TypeString; - model.fields['version'] = TypeNumber; - if (statuses) { - model.fields['status'] = { ...TypeStatus, extra: statuses }; + model.fields['status'] = { + ...TypeStatus, + displayName: 'Status', + description: 'The status of the content item.', + extra: statuses + }; } for (const field of schema.fields) { @@ -216,10 +249,22 @@ export function queryModelFromSchema(schema: SchemaDetailsDto, languages: Readon } if (type) { - const codes = field.isLocalizable ? languagesCodes : invariantCodes; - - for (const code of codes) { - model.fields[`data.${field.name}.${code}`] = type; + if (field.isLocalizable) { + for (const code of languagesCodes) { + const infos = { + displayName: `${field.displayName} (${code})`, + description: `The '${field.displayName}' field of the content item (localized).` + }; + + model.fields[`data.${field.name}.${code}`] = { ...type, ...infos }; + } + } else { + const infos = { + displayName: field.displayName, + description: `The '${field.displayName}' field of the content item.` + }; + + model.fields[`data.${field.name}.iv`] = { ...type, ...infos }; } } } diff --git a/frontend/app/theme/_forms.scss b/frontend/app/theme/_forms.scss index 071980d4a..61848e416 100644 --- a/frontend/app/theme/_forms.scss +++ b/frontend/app/theme/_forms.scss @@ -165,6 +165,10 @@ background: $color-theme-blue; border: 0; color: $color-dark-foreground; + + & * { + color: $color-dark-foreground !important; + } } } }