Merge branch 'feature/104364' into test/stage

CHANGELOG.md

@@ -6,6 +6,8 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 
 
 ## [Unreleased]
+### Added
+- `width` and `height` attributes to menu node images (DEV-102271)
 
 ## [2.26.0] - 2024-03-29
 ### Fixed

view/adminhtml/templates/menu/nodes.phtml

@@ -51,6 +51,7 @@ $vueComponents = $block->getVueComponents();
  "createSubNode" : "<?= __('to create sub node or drag and drop other nodes here.') ?>",
  "append" : "<?= __('Append') ?>",
  "edit" : "<?= __('Edit') ?>",
+ "duplicate" : "<?= __('Duplicate') ?>",
  "delete" : "<?= __('Delete') ?>",
  "addNode" : "<?= __('New node') ?>",
  "nodeType" : "<?= __('Node Type') ?>",

view/adminhtml/web/css/source/blocks/_panel.less

@@ -64,7 +64,7 @@
  padding-left: 5px;
  }
 
- &__buttom {
+ &__button {
  border-color: transparent;
  color: @primary__color;
  background-color: transparent;
@@ -107,6 +107,12 @@
  content: @icon-delete__content;
  }
  }
+
+ &--duplicate {
+ height: @snow-menu__item-height;
+ padding-top: 4px;
+ vertical-align: middle;
+ }
  }
 
  &__collapse {

view/adminhtml/web/vue/app.vue

@@ -9,7 +9,7 @@
 
  <div>
  <button
- class="panel__buttom panel__buttom--append"
+ class="panel__button panel__button--append"
  :title="config.translation.append"
  @click.prevent="addNode(list)"
  />
@@ -35,6 +35,7 @@
  :selected-item="selectedItem"
  :delete="removeNode"
  :append="addNode"
+ :duplicate="duplicateNode"
  :drop="handleDrop"
  :config="config"
  />
@@ -46,7 +47,7 @@
  >
  {{ config.translation.click }}
  <button
- class="panel__buttom panel__buttom--append"
+ class="panel__button panel__button--append"
  :title="config.translation.append"
  @click.prevent="addNode(list)"
  />
@@ -77,19 +78,19 @@
  required: true
  }
  },
- data: function() {
+ data() {
  return {
  list: [],
  selectedItem: null
  };
  },
  computed: {
- jsonList: function() {
+ jsonList() {
  return JSON.stringify(this.list);
  }
  },
  watch: {
- jsonList: function (newValue) {
+ jsonList (newValue) {
  this.updateSerializedNodes(newValue)
  }
  },
@@ -116,13 +117,13 @@
  },
  methods: {
  uuid,
- setSelectedNode: function(item) {
+ setSelectedNode(item) {
  this.selectedItem = item;
  },
- removeNode: function(list, index) {
+ removeNode(list, index) {
  list.splice(index, 1);
  },
- addNode: function(target) {
+ addNode(target) {
  target.push({
  id: this.uuid(),
  uuid: this.uuid(),
@@ -139,6 +140,28 @@
  is_active: 0
  });
  },
+ setUniqueIds(node) {
+ if (node !== null) {
+ node = {
+ ...node,
+ id: this.uuid(),
+ uuid: this.uuid(),
+ // TODO: support for image duplication - copying values isn't enough
+ image: null,
+ image_alt_text: '',
+ image_width: null,
+ image_height: null,
+ };
+ if (node.columns?.length) {
+ node.columns = node.columns.map(this.setUniqueIds);
+ }
+ }
+ return node;
+ },
+ duplicateNode(list, index) {
+ const newNode = this.setUniqueIds(list[index])
+ list.splice(++index, 0, newNode);
+ },
  handleDrop(data) {
  data.item.uuid = this.uuid();
  data.list.splice(data.index, 0, data.item);

view/adminhtml/web/vue/field-type/autocomplete-lazy.vue

@@ -23,7 +23,7 @@
  :required="required"
  @input="setValue"
  >
- <template v-slot:value-label="{ node }">
+ <template #value-label="{ node }">
  {{ node.raw.full_label }}
  </template>
  </treeselect>
@@ -37,7 +37,7 @@
  :disabled="isDisabled"
  :required="required"
  >
- <template v-slot:option="option">
+ <template #option="option">
  {{ option.label }}
 
  <template v-if="option.store && option.store.length">
@@ -106,7 +106,7 @@
  initialLoaded: false
  }),
  computed: {
- placeholder: function() {
+ placeholder() {
  return this.config.translation.pleaseSelect + ' ' + this.label.toLocaleLowerCase();
  },
  loadedOptions() {

view/adminhtml/web/vue/field-type/autocomplete.vue

@@ -20,7 +20,7 @@
  :clearable="false"
  :required="required"
  >
- <template v-slot:value-label="{ node }">
+ <template #value-label="{ node }">
  {{ node.raw.full_label }}
  </template>
  </treeselect>
@@ -34,7 +34,7 @@
  :disabled="isDisabled"
  :required="required"
  >
- <template v-slot:option="option">
+ <template #option="option">
  {{ option.label }}
 
  <template v-if="option.store && option.store.length">
@@ -140,10 +140,10 @@
  }
  }
  },
- placeholder: function() {
+ placeholder() {
  return this.config.translation.pleaseSelect + ' ' + this.label.toLocaleLowerCase();
  },
- optionsTree: function() {
+ optionsTree() {
  const hashTable = {},
  optionsTree = [];
 

view/adminhtml/web/vue/field-type/checkbox.vue

@@ -66,18 +66,18 @@ define(["Vue"], function(Vue) {
  required: true
  }
  },
- data: function() {
+ data() {
  return {
  fieldId: '',
  checkboxValue: this.value === '1' ? true : false
  }
  },
  watch: {
- checkboxValue: function(newValue) {
+ checkboxValue(newValue) {
  this.item.is_active = newValue ? '1' : '0';
  }
  },
- mounted: function() {
+ mounted() {
  this.fieldId = 'snowmenu_' + this.id + '_' + this._uid;
  },
  template: template