From d2eca44325caac5c0388348f94cd30ba5427db92 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jo=C5=BEe=20Fortun?= Date: Mon, 16 Oct 2023 16:53:14 +0200 Subject: [PATCH] Fix page layout expressions variables when switching from view to edit mode --- .../compose/src/mixins/conditionalFields.js | 3 +- client/web/compose/src/mixins/record.js | 5 ++- .../compose/src/views/Admin/Pages/Edit.vue | 28 +++++++++---- .../src/views/Public/Pages/Records/View.vue | 40 ++++++++++++------- .../compose/src/views/Public/Pages/View.vue | 3 -- locale/en/corteza-webapp-compose/page.yaml | 4 +- 6 files changed, 53 insertions(+), 30 deletions(-) diff --git a/client/web/compose/src/mixins/conditionalFields.js b/client/web/compose/src/mixins/conditionalFields.js index 060407c10..826de1a66 100644 --- a/client/web/compose/src/mixins/conditionalFields.js +++ b/client/web/compose/src/mixins/conditionalFields.js @@ -27,7 +27,8 @@ export default { prepareFieldConditionsData () { const expressions = {} - const variables = { record: this.record.serialize() } + const record = this.record ? this.record.serialize() : {} + const variables = { record } this.block.options.fieldConditions.forEach(({ field, condition }) => { if (field && condition) { expressions[field] = condition diff --git a/client/web/compose/src/mixins/record.js b/client/web/compose/src/mixins/record.js index 51c375829..6c297f290 100644 --- a/client/web/compose/src/mixins/record.js +++ b/client/web/compose/src/mixins/record.js @@ -172,8 +172,9 @@ export default { if (!isNew) { this.record = record - this.determineLayout() - this.$root.$emit(`refetch-non-record-blocks:${this.page.pageID}`) + this.determineLayout().then(() => { + this.$root.$emit(`refetch-non-record-blocks:${this.page.pageID}`) + }) } } diff --git a/client/web/compose/src/views/Admin/Pages/Edit.vue b/client/web/compose/src/views/Admin/Pages/Edit.vue index b53f7ba0a..82c8a2b56 100644 --- a/client/web/compose/src/views/Admin/Pages/Edit.vue +++ b/client/web/compose/src/views/Admin/Pages/Edit.vue @@ -497,15 +497,27 @@ - "record.values.fieldName" - "user.(userID/email...)" - "screen.(width/height)" - "isView/isCreate/isEdit" - "user.userID == record.values.createdBy" - "screen.width < 1024" + record.values.fieldName + user.(userID/email...) + screen.(width/height) + isView/isCreate/isEdit + user.userID == record.values.createdBy + screen.width < 1024 + + + + user.(userID/email...) + screen.(width/height) + user.email == "test@mail.com" + screen.width < 1024 diff --git a/client/web/compose/src/views/Public/Pages/Records/View.vue b/client/web/compose/src/views/Public/Pages/Records/View.vue index 28dc34461..23397c318 100644 --- a/client/web/compose/src/views/Public/Pages/Records/View.vue +++ b/client/web/compose/src/views/Public/Pages/Records/View.vue @@ -347,9 +347,9 @@ export default { return response() .then(record => { - setTimeout(() => { + return new Promise(resolve => setTimeout(resolve, 300)).then(() => { this.record = new compose.Record(module, record) - }, 300) + }) }) .catch(e => { if (!axios.isCancel(e)) { @@ -418,16 +418,25 @@ export default { }, handleEdit () { - this.inEditing = true - this.inCreating = false + this.processing = true + + this.refresh({ isView: false, isEdit: true, isCreate: false }).then(() => { + this.inEditing = true + this.inCreating = false + + this.$root.$emit(`refetch-non-record-blocks:${this.page.pageID}`) + }).finally(() => { + this.processing = false + }) }, handleView () { this.processing = true - this.refresh().then(() => { + this.refresh({ isView: true, isEdit: false, isCreate: false }).then(() => { this.inEditing = false this.inCreating = false + this.$root.$emit(`refetch-non-record-blocks:${this.page.pageID}`) }).finally(() => { this.processing = false @@ -447,11 +456,11 @@ export default { } }, - evaluateLayoutExpressions () { + evaluateLayoutExpressions (variables = {}) { const expressions = {} - const variables = { + variables = { user: this.$auth.user, - record: this.record.serialize() || {}, + record: this.record ? this.record.serialize() : {}, screen: { width: window.innerWidth, height: window.innerHeight, @@ -460,9 +469,10 @@ export default { }, oldLayout: this.layout, layout: undefined, - isView: this.$route.name === 'page.record', - isCreate: this.$route.name === 'page.record.create', - isEdit: this.$route.name === 'page.record.edit', + isView: !this.inEditing && !this.inCreating, + isCreate: this.inCreating, + isEdit: this.inEditing, + ...variables, } this.layouts.forEach(layout => { @@ -482,14 +492,14 @@ export default { }) }, - async determineLayout (pageLayoutID) { + async determineLayout (pageLayoutID, variables = {}) { // Clear stored records so they can be refetched with latest values this.clearRecordSet() let expressions = {} // Only evaluate if one of the layouts has an expressions variable if (this.layouts.some(({ config = {} }) => config.visibility.expression)) { - expressions = await this.evaluateLayoutExpressions() + expressions = await this.evaluateLayoutExpressions(variables) } // Check layouts for expressions/roles and find the first one that fits @@ -544,9 +554,9 @@ export default { this.$root.$emit(`refetch-non-record-blocks:${this.page.pageID}`) }, - async refresh () { + async refresh (variables = {}) { return this.loadRecord().then(() => { - return this.determineLayout() + return this.determineLayout(undefined, variables) }) }, diff --git a/client/web/compose/src/views/Public/Pages/View.vue b/client/web/compose/src/views/Public/Pages/View.vue index ea3fbce2a..36e60396f 100644 --- a/client/web/compose/src/views/Public/Pages/View.vue +++ b/client/web/compose/src/views/Public/Pages/View.vue @@ -244,9 +244,6 @@ export default { user: this.$auth.user, oldLayout: this.layout, layout: undefined, - isView: this.$route.name === 'page.record', - isCreate: this.$route.name === 'page.record.create', - isEdit: this.$route.name === 'page.record.edit', } this.layouts.forEach(layout => { diff --git a/locale/en/corteza-webapp-compose/page.yaml b/locale/en/corteza-webapp-compose/page.yaml index 97ce32b02..b4cb53e67 100644 --- a/locale/en/corteza-webapp-compose/page.yaml +++ b/locale/en/corteza-webapp-compose/page.yaml @@ -13,7 +13,9 @@ page-layout: condition: label: Condition placeholder: When will the layout be shown - description: "You can use {{0}}, {{1}}, {{2}}, {{3}} inside the expression, for example: {{4}} or {{5}}" + description: + record-page: "You can use {{0}}, {{1}}, {{2}}, {{3}} inside the expression, for example: {{4}} or {{5}}" + non-record-page: "You can use {{0}}, {{1}} inside the expression, for example: {{2}} or {{3}}" roles: label: Roles placeholder: Pick roles that the layout will be shown to