Skip to content

Commit

Permalink
Fix page duplicate issues
Browse files Browse the repository at this point in the history
  • Loading branch information
@asika32764
asika32764 committed Apr 8, 2024
1 parent d923f2c commit 07fada1
Show file tree
Hide file tree
Showing 5 changed files with 3,407 additions and 53 deletions.
3,322 changes: 3,319 additions & 3 deletions assets/dist/page-builder.js
View file

Large diffs are not rendered by default.

74 changes: 35 additions & 39 deletions assets/src/vue/app/PageBuilderApp.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -165,7 +165,7 @@ import {
emptyRow,
readClipboard,
savePage as doSavePage,
bindSaveButton
bindSaveButton, duplicateAny
} from '../services/page-builder/page-builder.service.js';
export default {
Expand Down Expand Up @@ -307,46 +307,42 @@ export default {
// Duplicate
function duplicateRow(row, i) {
row = JSON.parse(JSON.stringify(row));
row.id = 'row-' + u.uid();
row.columns = handleDuplicateColumns(row.columns);
row = duplicateAny(row);
state.content.splice(i + 1, 0, row);
}
function handleDuplicateColumns(columns) {
return columns.map(column => {
column.id = 'col-' + u.uid();
column.addons = handleDuplicateAddons(column.addons);
return column;
});
}
function handleDuplicateAddons(addons) {
return addons.map(addon => {
if (addon.type !== 'row') {
addon.id = 'addon-' + u.uid();
return addon;
}
// Is row
addon.id = 'row-' + u.uid();
addon.columns = addon.columns.map(column => {
column.id = 'col-' + u.uid();
column.addons = handleDuplicateAddons(column.addons);
return column;
});
return addon;
});
}
// function handleDuplicateColumns(columns) {
// return columns.map(column => {
// column.id = 'col-' + u.uid();
//
// column.addons = handleDuplicateAddons(column.addons);
//
// return column;
// });
// }
//
// function handleDuplicateAddons(addons) {
// return addons.map(addon => {
// if (addon.type !== 'row') {
// addon.id = 'addon-' + u.uid();
// return addon;
// }
//
// // Is row
// addon.id = 'row-' + u.uid();
//
// addon.columns = addon.columns.map(column => {
// column.id = 'col-' + u.uid();
//
// column.addons = handleDuplicateAddons(column.addons);
//
// return column;
// });
//
// return addon;
// });
// }
// Events
function columnsChange(row, $event) {
Expand Down Expand Up @@ -415,8 +411,8 @@ export default {
pasteTo,
pastePage,
duplicateRow,
handleDuplicateAddons,
handleDuplicateColumns,
// handleDuplicateAddons,
// handleDuplicateColumns,
columnsChange,
selectAddon,
emptyRow,
Expand Down
6 changes: 3 additions & 3 deletions assets/src/vue/components/page-builder/Column.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -105,7 +105,7 @@
<button type="button" class="dropdown-item" @click="duplicate()"
v-if="!content.disabled">
<span class="fa fa-fw fa-clone"></span>
Clone
Duplicate
</button>
<button type="button" class="dropdown-item" @click="copy()"
v-if="!content.disabled">
Expand Down Expand Up @@ -193,7 +193,7 @@ import { defaultsDeep, range, startsWith, values } from 'lodash-es';
import { computed, reactive, toRefs, watch } from 'vue';
import {
addTextToClipboard,
duplicateAddon,
duplicateAddon, duplicateAny,
emptyColumn,
emptyRow,
readClipboard
Expand Down Expand Up @@ -316,7 +316,7 @@ export default {
}
function duplicateThisAddon(item, i) {
const newItem = duplicateAddon(item, props.child);
const newItem = duplicateAny(item, props.child);
if (newItem) {
addons.value.splice(i + 1, 0, newItem);
Expand Down
8 changes: 2 additions & 6 deletions assets/src/vue/components/page-builder/Row.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -143,7 +143,7 @@ import {
emptyColumn,
emptyRow,
readClipboard,
duplicateAddon
duplicateAddon, duplicateAny
} from '@/services/page-builder/page-builder.service';
export default {
Expand Down Expand Up @@ -259,11 +259,7 @@ export default {
}
function duplicateColumn(column, i) {
column = JSON.parse(JSON.stringify(column));
column.id = 'col-' + u.uid();
column.addons = handleDuplicateAddons(column.addons);
column = duplicateAny(column);
state.content.columns.splice(i + 1, 0, column);
}
Expand Down
50 changes: 48 additions & 2 deletions assets/src/vue/services/page-builder/page-builder.service.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -88,18 +88,64 @@ export function readClipboard() {
});
}

export function duplicateAny(data, child = false) {
data = JSON.parse(JSON.stringify(data));

if (Array.isArray(data)) {
return data.map((datum) => duplicateAny(datum));
}

if (data.id.startsWith('row-')) {
return duplicateRow(data);
}

if (data.id.startsWith('col-')) {
return duplicateColumn(data);
}

if (data.id.startsWith('addon-')) {
return duplicateAddon(data, child);
}

throw new Error('Unable to duplicate this type.');
}

export function duplicateRow(row) {
row = JSON.parse(JSON.stringify(row));

row.id = 'row-' + u.uid();

row.columns = row.columns.map((column) => duplicateColumn(column));

return row;
}

export function duplicateColumn(column) {
column = JSON.parse(JSON.stringify(column));

column.id = 'col-' + u.uid();

column.addons = column.addons.map((addon) => duplicateAddon(addon))
.filter((addon) => addon != null);

return column;
}

export function duplicateAddon(item, child = false) {
const newItem = JSON.parse(JSON.stringify(item));
let newItem = JSON.parse(JSON.stringify(item));

if (item.type === 'row' || startsWith(item.id, 'row-')) {
// Row
if (child) {
console.log('Cannot add row to child column.');
return null;
}

newItem.id = 'row-' + u.uid();
newItem.type = 'row';

newItem = duplicateRow(newItem);
} else {
// Addon
newItem.id = 'addon-' + u.uid();
}

Expand Down

0 comments on commit 07fada1

Please sign in to comment.