diff --git a/resources/js/components/structures/PageEditor.vue b/resources/js/components/structures/PageEditor.vue index 02fe429723f..58e0fbb8cd8 100644 --- a/resources/js/components/structures/PageEditor.vue +++ b/resources/js/components/structures/PageEditor.vue @@ -93,6 +93,7 @@ export default { blueprint: Object, handle: String, editEntryUrl: String, + depth: Number, creating: Boolean, readOnly: Boolean, }, @@ -284,7 +285,7 @@ export default { this.originValues = info.originValues; this.meta = info.meta; this.originMeta = info.originMeta; - this.extraValues = info.extraValues; + this.extraValues = { ...info.extraValues, depth: this.depth }; this.localizedFields = info.localizedFields; }, diff --git a/resources/js/components/structures/PageTree.vue b/resources/js/components/structures/PageTree.vue index 93e2504bb71..a62709b56fc 100644 --- a/resources/js/components/structures/PageTree.vue +++ b/resources/js/components/structures/PageTree.vue @@ -347,6 +347,10 @@ export default { this.$emit('changed', this.pages); }, + depthOf(page) { + return this.$refs.tree.getStat(page).level; + }, + expandAll() { this.$refs.tree.openAll(); this.collapsedState = []; diff --git a/resources/js/pages/navigation/Show.vue b/resources/js/pages/navigation/Show.vue index 6684cc7ee6b..f770edd0802 100644 --- a/resources/js/pages/navigation/Show.vue +++ b/resources/js/pages/navigation/Show.vue @@ -117,6 +117,10 @@ export default { return; }, + + newPageDepth() { + return this.targetParent ? this.targetParent.level + 1 : 1; + }, }, watch: { @@ -186,7 +190,7 @@ export default { }, editPage(page) { - this.editingPage = { page }; + this.editingPage = { page, depth: this.$refs.tree.depthOf(page) }; }, updatePage(values) { @@ -550,6 +554,7 @@ export default { :site="site" :id="editingPage.page.id" :entry="editingPage.page.entry" + :depth="editingPage.depth" :editEntryUrl="editingPage.page.entry ? editingPage.page.edit_url : null" :publish-info="publishInfo[editingPage.page.id]" :blueprint="blueprint" @@ -565,6 +570,7 @@ export default { v-if="creatingPage" creating :site="site" + :depth="newPageDepth" :blueprint="blueprint" :handle="handle" :read-only="!canEdit" diff --git a/resources/js/tests/components/structures/PageTree.test.js b/resources/js/tests/components/structures/PageTree.test.js index 449ae2ac6d2..c460c4ed608 100644 --- a/resources/js/tests/components/structures/PageTree.test.js +++ b/resources/js/tests/components/structures/PageTree.test.js @@ -86,3 +86,31 @@ test('an editable tree takes the save shortcut and gives it back', async () => { expect(save).toHaveBeenCalledTimes(1); expect(outerSaves).toBe(1); }); + +test('a page reports the depth it currently sits at, not the depth it was loaded with', async () => { + const child = { id: 'child', title: 'Child', depth: 2, children: [] }; + const parent = { id: 'parent', title: 'Parent', depth: 1, children: [child] }; + + const wrapper = mount(PageTree, { + props: { + pagesUrl: '/test/pages', + editable: false, + }, + global: { + stubs: { TreeBranch: true, PanelHeader: true, Panel: true, Icon: true }, + mocks: { + $keys: keys, + $config: { get: (key, fallback) => fallback }, + $axios: { get: () => Promise.resolve({ data: { pages: [parent] } }) }, + }, + }, + }); + await flushPromises(); + + expect(wrapper.vm.depthOf(child)).toBe(2); + + const tree = wrapper.vm.$refs.tree; + tree.move(tree.getStat(child), null, 1); + + expect(wrapper.vm.depthOf(child)).toBe(1); +});