mirror of
https://github.com/directus/directus.git
synced 2026-04-25 03:00:53 -04:00
Show sub fields if parent exists (#15041)
* Show sub fields if parent exists Search relationship fields * Revert back to 20
This commit is contained in:
@@ -3,7 +3,7 @@
|
||||
<slot name="prepend" />
|
||||
<v-list-item v-if="fieldsCount > 20">
|
||||
<v-list-item-content>
|
||||
<v-input v-model="search" autofocus small :placeholder="t('search')">
|
||||
<v-input v-model="search" autofocus small :placeholder="t('search')" @click.stop>
|
||||
<template #append>
|
||||
<v-icon small name="search" />
|
||||
</template>
|
||||
@@ -23,12 +23,12 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { useFieldTree } from '@/composables/use-field-tree';
|
||||
import { FieldNode, useFieldTree } from '@/composables/use-field-tree';
|
||||
import { Field } from '@directus/shared/types';
|
||||
import { computed, ref, toRefs, watch } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import VFieldListItem from './v-field-list-item.vue';
|
||||
import { debounce } from 'lodash';
|
||||
import { debounce, isNil } from 'lodash';
|
||||
import { useFieldsStore } from '@/stores/fields';
|
||||
|
||||
interface Props {
|
||||
@@ -86,14 +86,17 @@ const treeList = computed(() => {
|
||||
}
|
||||
});
|
||||
|
||||
function filter(field: Field): boolean {
|
||||
function filter(field: Field, parent?: FieldNode): boolean {
|
||||
if (
|
||||
!includeRelations.value &&
|
||||
(field.collection !== collection.value || (field.type === 'alias' && !field.meta?.special?.includes('group')))
|
||||
)
|
||||
return false;
|
||||
if (!search.value) return true;
|
||||
const children = fieldsStore.getFieldGroupChildren(collection.value, field.field);
|
||||
if (!search.value || isNil(parent) === false) return true;
|
||||
|
||||
const children = isNil(field.schema?.foreign_key_table)
|
||||
? fieldsStore.getFieldGroupChildren(field.collection, field.field)
|
||||
: fieldsStore.getFieldsForCollection(field.schema!.foreign_key_table);
|
||||
return children?.some((field) => matchesSearch(field)) || matchesSearch(field);
|
||||
|
||||
function matchesSearch(field: Field) {
|
||||
|
||||
@@ -26,7 +26,7 @@ export type FieldTreeContext = {
|
||||
export function useFieldTree(
|
||||
collection: Ref<string | null>,
|
||||
inject?: Ref<{ fields: Field[]; relations: Relation[] } | null>,
|
||||
filter: (field: Field) => boolean = () => true
|
||||
filter: (field: Field, parent?: FieldNode) => boolean = () => true
|
||||
): FieldTreeContext {
|
||||
const fieldsStore = useFieldsStore();
|
||||
const relationsStore = useRelationsStore();
|
||||
@@ -60,7 +60,7 @@ export function useFieldTree(
|
||||
field.meta?.special?.includes('group') ||
|
||||
(!field.meta?.special?.includes('alias') && !field.meta?.special?.includes('no-data'))
|
||||
)
|
||||
.filter((field) => filter(field));
|
||||
.filter((field) => filter(field, parent));
|
||||
|
||||
const topLevelFields = allFields.filter((field) => {
|
||||
if (parent?.group === true) return field.meta?.group === parent?.field;
|
||||
|
||||
Reference in New Issue
Block a user