Fix fields order in Fields Permissions (#11265)

* fix fields ordering in Fields Permissions

* extract logic into reusable function

* refine comment
This commit is contained in:
Azri Kahar
2022-01-25 23:23:25 +08:00
committed by GitHub
parent 260fcd5091
commit bd39b1b546
3 changed files with 33 additions and 24 deletions

View File

@@ -43,34 +43,13 @@ export function useFieldTree(
function getTree(collection?: string | null, parent?: FieldNode) {
const injectedFields = inject?.value?.fields.filter((field) => field.collection === collection);
const fields = fieldsStore
.getFieldsForCollection(collection!)
.getFieldsForCollectionSorted(collection!)
.concat(injectedFields || [])
.filter(
(field: Field) =>
field.meta?.special?.includes('group') ||
(!field.meta?.special?.includes('alias') && !field.meta?.special?.includes('no-data'))
);
const nonGroupFields = fields.filter((field: Field) => !field.meta?.group);
const sortGroupFields = (a: Field, b: Field) => {
if (!a.meta?.sort || !b.meta?.sort) return 0;
return a.meta.sort - b.meta.sort;
};
for (const [index, field] of nonGroupFields.entries()) {
const groupFields = fields.filter((groupField: Field) => groupField.meta?.group === field.field);
if (groupFields.length) {
nonGroupFields.splice(index + 1, 0, ...groupFields.sort(sortGroupFields));
}
}
const sortedFields = nonGroupFields
.filter((field) => !field.meta?.special?.includes('alias') && !field.meta?.special?.includes('no-data'))
.filter(filter)
.flatMap((field) => makeNode(field, parent));
return sortedFields.length ? sortedFields : undefined;
return fields.length ? fields : undefined;
}
function makeNode(field: Field, parent?: FieldNode): FieldNode | FieldNode[] {

View File

@@ -32,6 +32,7 @@ import { Permission, Role } from '@directus/shared/types';
import { Field } from '@directus/shared/types';
import { useSync } from '@directus/shared/composables';
import { useFieldsStore } from '@/stores';
import { clone, orderBy } from 'lodash';
export default defineComponent({
props: {
@@ -57,7 +58,7 @@ export default defineComponent({
const internalPermission = useSync(props, 'permission', emit);
const fieldsInCollection = computed(() => {
const fields = fieldsStore.getFieldsForCollection(props.permission.collection);
const fields = fieldsStore.getFieldsForCollectionSorted(props.permission.collection);
return fields.map((field: Field) => {
return {

View File

@@ -252,6 +252,35 @@ export const useFieldsStore = defineStore({
else return 1;
});
},
/**
* Retrieve sorted fields including groups. This is necessary because
* fields inside groups starts their sort number from 1 to N again.
*/
getFieldsForCollectionSorted(collection: string): Field[] {
const fields = this.fields
.filter((field) => field.collection === collection)
.filter(
(field: Field) =>
field.meta?.special?.includes('group') ||
(!field.meta?.special?.includes('alias') && !field.meta?.special?.includes('no-data'))
);
const nonGroupFields = fields.filter((field: Field) => !field.meta?.group);
const sortGroupFields = (a: Field, b: Field) => {
if (!a.meta?.sort || !b.meta?.sort) return 0;
return a.meta.sort - b.meta.sort;
};
for (const [index, field] of nonGroupFields.entries()) {
const groupFields = fields.filter((groupField: Field) => groupField.meta?.group === field.field);
if (groupFields.length) {
nonGroupFields.splice(index + 1, 0, ...groupFields.sort(sortGroupFields));
}
}
return nonGroupFields;
},
/**
* Retrieve field info for a field or a related field
*/