|
|
@@ -140,7 +140,12 @@
|
|
|
<script>
|
|
|
import { getRandomNumber } from '@/utils/index';
|
|
|
import { componentList } from '../../data/bookType';
|
|
|
-import { ContentSaveCoursewareContent, ContentGetCoursewareContent, GetBookUnifiedAttrib } from '@/api/book';
|
|
|
+import {
|
|
|
+ ContentSaveCoursewareContent,
|
|
|
+ ContentGetCoursewareContent,
|
|
|
+ GetBookUnifiedAttrib,
|
|
|
+ ContentSaveCoursewareComponentContent,
|
|
|
+} from '@/api/book';
|
|
|
import _ from 'lodash';
|
|
|
import { unified_attrib } from '@/common/data';
|
|
|
|
|
|
@@ -1069,6 +1074,7 @@ export default {
|
|
|
if (this.enterCanvas) {
|
|
|
if (this.curType === 'component') {
|
|
|
this.handleComponentMove();
|
|
|
+ return;
|
|
|
}
|
|
|
|
|
|
if (this.curRow >= -1 && this.curCol <= -1) {
|
|
|
@@ -1076,35 +1082,10 @@ export default {
|
|
|
}
|
|
|
|
|
|
if (this.curRow >= -1 && this.curCol > -1 && this.curGrid <= -1) {
|
|
|
- // 当拖拽组件和放置位置在同一列内,且行内组件数量为 1,将 curRow 减 1,才能正确插入
|
|
|
- if ('col' in this.curParams) {
|
|
|
- const { col, row, rowNum } = this.curParams;
|
|
|
- if (col === this.curCol && row === this.curRow && rowNum === 1) {
|
|
|
- this.curRow = Math.max(0, this.curRow - 1);
|
|
|
- this.calculateRowInsertedObject();
|
|
|
- return;
|
|
|
- }
|
|
|
- }
|
|
|
this.calculateColObject();
|
|
|
}
|
|
|
|
|
|
if (this.curRow >= -1 && this.curCol > -1 && this.curGrid > -1) {
|
|
|
- if ('col' in this.curParams) {
|
|
|
- const { col, row, grid } = this.curParams;
|
|
|
-
|
|
|
- // 当拖拽组件和放置位置在同一列内,将 curGrid 减 1,对应上面的删除组件,才能正确插入
|
|
|
- if (col === this.curCol && row === this.curRow && grid < this.curGrid) {
|
|
|
- this.curGrid = Math.max(0, this.curGrid - 1);
|
|
|
- }
|
|
|
-
|
|
|
- // 当拖拽组件和放置位置在同一列内,且行内组件数量为 1,将 curRow 减 1,才能正确插入
|
|
|
- if (col === this.curCol && row === this.curRow && grid === this.curGrid) {
|
|
|
- this.curRow = Math.max(0, this.curRow - 1);
|
|
|
- this.calculateRowInsertedObject();
|
|
|
- return;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
this.calculateGridObject();
|
|
|
}
|
|
|
}
|
|
|
@@ -1116,8 +1097,11 @@ export default {
|
|
|
* 处理组件移动
|
|
|
* 组件拖拽移动后,先删除组件,再根据拖拽位置计算插入行、列、格子
|
|
|
*/
|
|
|
- handleComponentMove() {
|
|
|
+ async handleComponentMove() {
|
|
|
const component = this.findChildComponentByKey(`grid-${this.curParams.id}`);
|
|
|
+ // 获取组件内容,保存后再插入到新的位置
|
|
|
+ const requestData = component.getComponentRequestContent();
|
|
|
+
|
|
|
const data = component?.data;
|
|
|
this.curType = data?.type || 'select';
|
|
|
let col = component?.$attrs['data-col'];
|
|
|
@@ -1136,6 +1120,49 @@ export default {
|
|
|
rowNum,
|
|
|
};
|
|
|
this.deleteComponent(this.curParams.id);
|
|
|
+
|
|
|
+ await ContentSaveCoursewareComponentContent(requestData);
|
|
|
+
|
|
|
+ if (this.curRow >= -1 && this.curCol <= -1) {
|
|
|
+ this.calculateRowInsertedObject();
|
|
|
+ }
|
|
|
+
|
|
|
+ if (this.curRow >= -1 && this.curCol > -1 && this.curGrid <= -1) {
|
|
|
+ // 当拖拽组件和放置位置在同一列内,且行内组件数量为 1,将 curRow 减 1,才能正确插入
|
|
|
+ if ('col' in this.curParams) {
|
|
|
+ const { col, row, rowNum } = this.curParams;
|
|
|
+ if (col === this.curCol && row === this.curRow && rowNum === 1) {
|
|
|
+ this.curRow = Math.max(0, this.curRow - 1);
|
|
|
+ this.calculateRowInsertedObject();
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.calculateColObject();
|
|
|
+ }
|
|
|
+
|
|
|
+ if (this.curRow >= -1 && this.curCol > -1 && this.curGrid > -1) {
|
|
|
+ if ('col' in this.curParams) {
|
|
|
+ const { col, row, grid } = this.curParams;
|
|
|
+
|
|
|
+ // 当拖拽组件和放置位置在同一列内,将 curGrid 减 1,对应上面的删除组件,才能正确插入
|
|
|
+ if (col === this.curCol && row === this.curRow && grid < this.curGrid) {
|
|
|
+ this.curGrid = Math.max(0, this.curGrid - 1);
|
|
|
+ }
|
|
|
+
|
|
|
+ // 当拖拽组件和放置位置在同一列内,且行内组件数量为 1,将 curRow 减 1,才能正确插入
|
|
|
+ if (col === this.curCol && row === this.curRow && grid === this.curGrid) {
|
|
|
+ this.curRow = Math.max(0, this.curRow - 1);
|
|
|
+ this.calculateRowInsertedObject();
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ this.calculateGridObject();
|
|
|
+ }
|
|
|
+
|
|
|
+ this.curType = '';
|
|
|
+ this.curParams = {};
|
|
|
+ this.enterCanvas = false;
|
|
|
},
|
|
|
/**
|
|
|
* 计算行样式
|