Remove empty content lists upon removal of the last inner element

This commit is contained in:
Ramon Wenger 2022-01-30 22:36:39 +01:00
parent a988b15b76
commit 7e0f16a5f2
1 changed files with 21 additions and 24 deletions

View File

@ -92,6 +92,7 @@
import NEW_CONTENT_BLOCK_MUTATION from '@/graphql/gql/mutations/addContentBlock.gql'; import NEW_CONTENT_BLOCK_MUTATION from '@/graphql/gql/mutations/addContentBlock.gql';
import {setUserBlockType} from '@/helpers/content-block'; import {setUserBlockType} from '@/helpers/content-block';
import MODULE_DETAILS_QUERY from '@/graphql/gql/queries/modules/moduleDetailsQuery.gql'; import MODULE_DETAILS_QUERY from '@/graphql/gql/queries/modules/moduleDetailsQuery.gql';
import {insertAtIndex, removeAtIndex, replaceAtIndex} from '@/graphql/immutable-operations';
export default Vue.extend({ export default Vue.extend({
props: { props: {
@ -118,15 +119,7 @@
title: '', title: '',
isAssignment: false, isAssignment: false,
contents: [ contents: [
{ {}
id: 23,
type: 'content_list_item',
contents: [
{
id: 2,
}
]
}
]}, ]},
}), }),
@ -186,23 +179,26 @@
}, },
remove(outer, inner) { remove(outer, inner) {
if (inner === undefined) { if (inner === undefined) {
this.contentBlock.contents = [ // not a list item container, just remove the element from the outer array
...this.contentBlock.contents.slice(0, outer), this.contentBlock.contents = removeAtIndex(this.contentBlock.contents, outer);
...this.contentBlock.contents.slice(outer + 1)
];
} else { } else {
this.contentBlock.contents = [ let prevInnerContents = this.contentBlock.contents[outer].contents;
...this.contentBlock.contents.slice(0, outer), let innerContents = removeAtIndex(prevInnerContents, inner);
{
...this.contentBlock.contents[outer],
contents: [
...this.contentBlock.contents[outer].contents.slice(0, inner),
...this.contentBlock.contents[outer].contents.slice(inner+1),
]
},
...this.contentBlock.contents.slice(outer + 1)
];
if (innerContents.length) {
/*
there is still an element inside the outer element after removal,
so we replace the previous element in the outer array with the new one with fewer contents
*/
let element = {
...this.contentBlock.contents[outer],
contents: innerContents
};
this.contentBlock.contents = replaceAtIndex(this.contentBlock.contents, outer, element);
} else {
// inner contents is now empty, remove the whole element from the outer array
this.contentBlock.contents = removeAtIndex(this.contentBlock.contents, outer);
}
} }
}, },
save({title, contents, isAssignment}) { save({title, contents, isAssignment}) {
@ -238,6 +234,7 @@
}).then(this.goToModule); }).then(this.goToModule);
}, },
goToModule() { goToModule() {
// use the history, so the scroll position is preserved
this.$router.go(-1); this.$router.go(-1);
} }
}, },