|
|
@@ -82,6 +82,7 @@
|
|
|
:component-move="componentMove(i, j, k)"
|
|
|
@deleteComponent="deleteComponent"
|
|
|
@showSetting="showSetting"
|
|
|
+ @copyComponent="copyComponent"
|
|
|
@changeData="changeData"
|
|
|
/>
|
|
|
<span
|
|
|
@@ -1321,6 +1322,88 @@ export default {
|
|
|
};
|
|
|
this.content_group_row_list = content_group_row_list || [];
|
|
|
},
|
|
|
+ /**
|
|
|
+ * @description 复制组件
|
|
|
+ * @param {object} data 组件数据
|
|
|
+ */
|
|
|
+ copyComponent(data) {
|
|
|
+ this.$emit('copyComponent', data);
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * @description 粘贴组件
|
|
|
+ * @param {Object} componentData 组件数据
|
|
|
+ * @param {String} position 放入位置类型
|
|
|
+ */
|
|
|
+ pasteComponent(componentData, position) {
|
|
|
+ if (!componentData) return;
|
|
|
+ let _data = JSON.parse(JSON.stringify(componentData));
|
|
|
+ const curId = this.getCurSettingId();
|
|
|
+ const attrs = this.findChildComponentByKey(`grid-${curId}`)?.$attrs;
|
|
|
+ if (!attrs) return;
|
|
|
+ const i = Number(attrs['data-row']);
|
|
|
+ const j = Number(attrs['data-col']);
|
|
|
+ let k = Number(attrs['data-grid']);
|
|
|
+ let type = _data.type;
|
|
|
+
|
|
|
+ let row = this.data.row_list[i];
|
|
|
+ let col = row.col_list[j];
|
|
|
+ let grid = col.grid_list;
|
|
|
+
|
|
|
+ const id = `ID-${getRandomNumber(12, true)}`;
|
|
|
+ const letter = `L${getRandomNumber(6, true)}`;
|
|
|
+
|
|
|
+ if (['top', 'bottom'].includes(position)) {
|
|
|
+ let rowNum = k === 0 ? 1 : grid[k - 1].row + 1;
|
|
|
+ if (position === 'bottom') {
|
|
|
+ rowNum = grid[k].row + 1;
|
|
|
+ }
|
|
|
+ k = position === 'top' ? k : k + 1;
|
|
|
+ grid.splice(k, 0, {
|
|
|
+ id,
|
|
|
+ grid_area: letter,
|
|
|
+ width: '100fr',
|
|
|
+ height: 'auto',
|
|
|
+ edit_height: 'auto',
|
|
|
+ row: rowNum,
|
|
|
+ type,
|
|
|
+ });
|
|
|
+ grid.forEach((item, i) => {
|
|
|
+ if (i > k) {
|
|
|
+ item.row += 1;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ if (['left', 'right'].includes(position)) {
|
|
|
+ let rowNum = grid[position === 'left' ? k : k - 1].row;
|
|
|
+ let _k = position === 'left' ? k : k + 1;
|
|
|
+ grid.splice(_k, 0, {
|
|
|
+ id,
|
|
|
+ grid_area: letter,
|
|
|
+ width: '100fr',
|
|
|
+ height: 'auto',
|
|
|
+ edit_height: 'auto',
|
|
|
+ row: rowNum,
|
|
|
+ type,
|
|
|
+ });
|
|
|
+
|
|
|
+ let allRowNum = grid.filter(({ row }) => row === rowNum).length;
|
|
|
+ let w = 0;
|
|
|
+ grid.forEach((item, i) => {
|
|
|
+ if (item.row === rowNum && i !== k) {
|
|
|
+ let width = Number(item.width.replace('fr', ''));
|
|
|
+ let diff = width / allRowNum;
|
|
|
+ item.width = `${width - diff}fr`;
|
|
|
+ w += diff;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ grid[_k].width = `${w}fr`;
|
|
|
+ }
|
|
|
+ this.$nextTick(() => {
|
|
|
+ let newComponent = this.findChildComponentByKey(`grid-${id}`); // 获取新添加的组件实例
|
|
|
+ newComponent?.setData(_data); // 设置新添加的组件数据
|
|
|
+ });
|
|
|
+ },
|
|
|
},
|
|
|
};
|
|
|
</script>
|
