|
|
@@ -89,6 +89,8 @@
|
|
|
<script>
|
|
|
import { previewComponentList } from '@/views/book/courseware/data/bookType';
|
|
|
|
|
|
+import _ from 'lodash';
|
|
|
+
|
|
|
export default {
|
|
|
name: 'CoursewarePreview',
|
|
|
provide() {
|
|
|
@@ -236,6 +238,7 @@ export default {
|
|
|
/**
|
|
|
* 计算行的可见性
|
|
|
* @params {string} rowId 行的ID
|
|
|
+ * @return {boolean} 行是否可见
|
|
|
*/
|
|
|
computedRowVisibility(rowId) {
|
|
|
if (this.groupShowAll) return true;
|
|
|
@@ -253,6 +256,113 @@ export default {
|
|
|
return this.rowCheckList[row_id];
|
|
|
},
|
|
|
/**
|
|
|
+ * 计算选中分组行的课件信息
|
|
|
+ * @returns {object} 选中分组行的课件信息
|
|
|
+ */
|
|
|
+ computedSelectedGroupCoursewareInfo() {
|
|
|
+ if (Object.keys(this.rowCheckList).length === 0) {
|
|
|
+ return {};
|
|
|
+ }
|
|
|
+ // 根据 rowCheckList 过滤出选中的行，获取这些行的组件信息
|
|
|
+ let coursewareInfo = structuredClone(this.data);
|
|
|
+ coursewareInfo.row_list = coursewareInfo.row_list.filter((row) => {
|
|
|
+ let groupRow = this.groupRowList.find(({ row_id }) => row_id === row.row_id);
|
|
|
+ if (!groupRow.is_pre_same_group) {
|
|
|
+ return this.rowCheckList[groupRow.row_id];
|
|
|
+ }
|
|
|
+ const index = this.groupRowList.findIndex(({ row_id }) => row_id === row.row_id);
|
|
|
+ if (index === -1) return false;
|
|
|
+ for (let i = index - 1; i >= 0; i--) {
|
|
|
+ if (!this.groupRowList[i].is_pre_same_group) {
|
|
|
+ return this.rowCheckList[this.groupRowList[i].row_id];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return false;
|
|
|
+ });
|
|
|
+ // 获取选中行的所有组件id列表
|
|
|
+ let component_id_list = coursewareInfo.row_list.flatMap((row) =>
|
|
|
+ row.col_list.flatMap((col) => col.grid_list.map((grid) => grid.id)),
|
|
|
+ );
|
|
|
+ // 获取选中行的分组列表描述
|
|
|
+ let content_group_row_list = this.groupRowList.filter(({ row_id, is_pre_same_group }) => {
|
|
|
+ if (!is_pre_same_group) {
|
|
|
+ return this.rowCheckList[row_id];
|
|
|
+ }
|
|
|
+ const index = this.groupRowList.findIndex(({ row_id: id }) => id === row_id);
|
|
|
+ if (index === -1) return false;
|
|
|
+ for (let i = index - 1; i >= 0; i--) {
|
|
|
+ if (!this.groupRowList[i].is_pre_same_group) {
|
|
|
+ return this.rowCheckList[this.groupRowList[i].row_id];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return false;
|
|
|
+ });
|
|
|
+
|
|
|
+ let groupIdList = _.cloneDeep(content_group_row_list);
|
|
|
+ let groupList = [];
|
|
|
+ // 通过判断 is_pre_same_group 将组合并
|
|
|
+ for (let i = 0; i < groupIdList.length; i++) {
|
|
|
+ if (groupIdList[i].is_pre_same_group) {
|
|
|
+ groupList[groupList.length - 1].row_id_list.push(groupIdList[i].row_id);
|
|
|
+ } else {
|
|
|
+ groupList.push({
|
|
|
+ name: '',
|
|
|
+ row_id_list: [groupIdList[i].row_id],
|
|
|
+ component_id_list: [],
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 通过合并后的分组，获取对应的组件 id 和分组名称
|
|
|
+ groupList.forEach(({ row_id_list, component_id_list }, i) => {
|
|
|
+ row_id_list.forEach((row_id, j) => {
|
|
|
+ let row = this.data.row_list.find((row) => {
|
|
|
+ return row.row_id === row_id;
|
|
|
+ });
|
|
|
+ // 当前行所有组件id列表
|
|
|
+ let gridIdList = row.col_list.map((col) => col.grid_list.map((grid) => grid.id)).flat();
|
|
|
+ component_id_list.push(...gridIdList);
|
|
|
+ // 查找每组第一行中第一个包含 describe、label 或 stem 的组件
|
|
|
+ if (j === 0) {
|
|
|
+ let findKey = '';
|
|
|
+ let findType = '';
|
|
|
+ row.col_list.some((col) => {
|
|
|
+ const findItem = col.grid_list.find(({ type }) => {
|
|
|
+ return ['describe', 'label', 'stem'].includes(type);
|
|
|
+ });
|
|
|
+ if (findItem) {
|
|
|
+ findKey = findItem.id;
|
|
|
+ findType = findItem.type;
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ let groupName = `组${i + 1}`;
|
|
|
+
|
|
|
+ // 如果有标签类组件，获取对应名称
|
|
|
+ if (findKey) {
|
|
|
+ let item = this.isEdit
|
|
|
+ ? this.findChildComponentByKey(`grid-${findKey}`)
|
|
|
+ : this.$refs.previewEdit.findChildComponentByKey(`preview-${findKey}`);
|
|
|
+ if (['describe', 'stem'].includes(findType)) {
|
|
|
+ groupName = item.data.content.replace(/<[^>]+>/g, '');
|
|
|
+ } else if (findType === 'label') {
|
|
|
+ groupName = item.data.dynamicTags.map((tag) => tag.text).join(', ');
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ groupList[i].name = groupName;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+
|
|
|
+ return {
|
|
|
+ content: JSON.stringify(coursewareInfo),
|
|
|
+ component_id_list: JSON.stringify(component_id_list),
|
|
|
+ content_group_row_list: JSON.stringify(content_group_row_list),
|
|
|
+ content_group_component_list: JSON.stringify(groupList),
|
|
|
+ };
|
|
|
+ },
|
|
|
+ /**
|
|
|
* 分割整数为多个 1的倍数
|
|
|
* @param {number} num
|
|
|
* @param {number} parts
|
|
|
@@ -865,7 +975,7 @@ export default {
|
|
|
|
|
|
.row-checkbox {
|
|
|
position: absolute;
|
|
|
- left: 4px;
|
|
|
+ left: -20px;
|
|
|
}
|
|
|
}
|
|
|
|
dsy