diff --git a/lang/en/messages.php b/lang/en/messages.php index 8e92c1c6e4f..9fa65df7fcd 100644 --- a/lang/en/messages.php +++ b/lang/en/messages.php @@ -88,6 +88,7 @@ 'entry_origin_instructions' => 'The new localization will inherit values from the entry in the selected site.', 'expect_root_instructions' => 'Consider the first page in the tree a "root" or "home" page.', 'field_conditions_always_save_instructions' => 'Always save field value, even if the field is hidden.', + 'field_conditions_reserve_space_when_hidden_instructions' => 'When hidden, reserve the field\'s space in the layout.', 'field_conditions_field_instructions' => 'You may enter any field handle. You are not limited to the options in the dropdown.', 'field_conditions_instructions' => 'When to show or hide this field.', 'field_desynced_from_origin' => 'Desynced from origin. Click to sync and revert to the origin\'s value.', diff --git a/resources/js/components/field-conditions/Builder.vue b/resources/js/components/field-conditions/Builder.vue index 895c9484e88..68fc16f954c 100644 --- a/resources/js/components/field-conditions/Builder.vue +++ b/resources/js/components/field-conditions/Builder.vue @@ -30,12 +30,23 @@ - - - +
+ + + + + + + +
@@ -77,6 +88,7 @@ export default { customMethod: null, conditions: [], alwaysSave: false, + reserveSpaceWhenHidden: false, }; }, @@ -135,12 +147,17 @@ export default { alwaysSave(alwaysSave) { this.$emit('updated-always-save', alwaysSave); }, + + reserveSpaceWhenHidden(reserveSpaceWhenHidden) { + this.$emit('updated-reserve-space-when-hidden', reserveSpaceWhenHidden); + }, }, created() { this.add(); this.getInitialConditions(); this.getInitialAlwaysSaveState(); + this.getInitialReserveSpaceWhenHiddenState(); }, methods: { @@ -187,6 +204,10 @@ export default { this.alwaysSave = data_get(this.config, 'always_save', false); }, + getInitialReserveSpaceWhenHiddenState() { + this.reserveSpaceWhenHidden = data_get(this.config, 'reserve_space_when_hidden', false); + }, + prepareEditableConditions(conditions) { return new Converter().fromBlueprint(conditions).map((condition) => { condition._id = uniqid(); diff --git a/resources/js/components/fields/Settings.vue b/resources/js/components/fields/Settings.vue index 5c02914bbee..1eaa3748c00 100644 --- a/resources/js/components/fields/Settings.vue +++ b/resources/js/components/fields/Settings.vue @@ -43,6 +43,7 @@ :suggestable-fields="suggestableConditionFields" @updated="updateFieldConditions" @updated-always-save="updateAlwaysSave" + @updated-reserve-space-when-hidden="updateReserveSpaceWhenHidden" /> @@ -263,6 +264,12 @@ export default { this.markFieldEdited('always_save'); }, + updateReserveSpaceWhenHidden(reserveSpaceWhenHidden) { + this.values.reserve_space_when_hidden = reserveSpaceWhenHidden; + + this.markFieldEdited('reserve_space_when_hidden'); + }, + markFieldEdited(handle) { if (this.editedFields.indexOf(handle) === -1) { this.editedFields.push(handle); diff --git a/resources/js/components/ui/Field.vue b/resources/js/components/ui/Field.vue index 0b4b9b4db5c..6cf910f224e 100644 --- a/resources/js/components/ui/Field.vue +++ b/resources/js/components/ui/Field.vue @@ -82,7 +82,7 @@ const hasErrors = computed(() => {