github/directus
1
1
Fork 0
mirror of https://github.com/directus/directus.git synced 2026-04-25 03:00:53 -04:00
Code Issues Packages Projects Releases Wiki Activity

O2M relation does not display correctly (#13866)

Browse Source 
* fix for o2m displaying item count

* fixes value structure for multi relations

* removed debugging code and comments and improved data mapping

* fix aliased fields for single relations

* removed unneeded fixes
This commit is contained in:
Brainslug
2022-06-14 20:30:49 +02:00
committed by GitHub
parent 7fa40b07fa
commit a88a80d6b9
2 changed files with 18 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/src/composables/use-alias-fields.ts
View File

@@ -3,7 +3,7 @@ import { Query } from '@directus/shared/types';
import { computed, ComputedRef, Ref } from 'vue';
import { merge } from 'lodash';
type AliasField = {
export type AliasField = {
fieldName: string;
fieldAlias: string;
fullAlias: string;

26
app/src/layouts/tabular/tabular.vue
View File

@@ -186,9 +186,9 @@ import { Field, Filter, Item, ShowSelect } from '@directus/shared/types';
import { ComponentPublicInstance, inject, ref, Ref, watch, computed } from 'vue';
import { useI18n } from 'vue-i18n';
import { get } from '@/utils/get-with-arrays';
import useAliasFields from '@/composables/use-alias-fields';
import useAliasFields, { AliasField } from '@/composables/use-alias-fields';
import adjustFieldsForDisplays from '@/utils/adjust-fields-for-displays';
import { merge, pick } from 'lodash';
import { merge } from 'lodash';
interface Props {
collection: string;
@@ -269,13 +269,21 @@ const { aliasFields } = useAliasFields(fieldsWithRelational);
function getAliasedValue(item: Record<string, any>, field: string) {
if (aliasFields.value![field]) return get(item, aliasFields.value![field].fullAlias);
const matchingAliasFields = Object.values(aliasFields.value!).filter((aliasField) => aliasField.fieldName === field);
const matchingKeys = matchingAliasFields.map((aliasField) => aliasField.fieldAlias);
const matchingPaths = matchingAliasFields.map((aliasField) => aliasField.fullAlias);
return Object.entries(pick(item, matchingPaths)).reduce((acc, [key, value]) => {
if (matchingKeys.includes(key)) merge(acc, value);
return acc;
}, {});
const matchingAliasFields = Object.values(aliasFields.value!).filter(
(aliasField: AliasField) => aliasField.fieldName === field
);
const matchingValues = matchingAliasFields.map(({ fieldAlias }) => item[fieldAlias]);
// if we have multiple results for each field pivot the data into a list of records
if (matchingValues.every((val) => Array.isArray(val))) {
return matchingValues.reduce((result, data) => {
for (let i = 0; i < data.length; i++) {
result[i] = merge(result[i], data[i]);
}
return result;
}, []);
}
// merge into a single record
return matchingValues.reduce((result, data) => merge(result, data), {});
}
function addField(fieldKey: string) {