|
@@ -547,6 +547,44 @@
|
|
</el-tabs>
|
|
</el-tabs>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
+ <div class="module-list-container">
|
|
|
|
+ <draggable
|
|
|
|
+ v-model="coms"
|
|
|
|
+ @add="onAdd"
|
|
|
|
+ @update="onDragEnd"
|
|
|
|
+ @end="onDragComplete"
|
|
|
|
+ group="itxst"
|
|
|
|
+ animation="300"
|
|
|
|
+ handle=".drag-handle"
|
|
|
|
+ :scroll="true"
|
|
|
|
+ :scrollSensitivity="100"
|
|
|
|
+ :scrollSpeed="20"
|
|
|
|
+ >
|
|
|
|
+ <transition-group style="display: block;">
|
|
|
|
+ <template v-for="(it, index) in coms">
|
|
|
|
+ <div
|
|
|
|
+ :key="index"
|
|
|
|
+ class="module-item"
|
|
|
|
+ :class="comIndex == index ? 'active-module' : ''"
|
|
|
|
+ >
|
|
|
|
+ <div class="drag-handle">
|
|
|
|
+ <img src="@/icons/svg/drag.svg" style="width: 20px;" icon-class="drag" />
|
|
|
|
+ </div>
|
|
|
|
+ <div class="module-info">
|
|
|
|
+ <div class="module-category">
|
|
|
|
+ <span class="label">模块分类:</span>
|
|
|
|
+ <span class="value">{{ getCategory(it.category_id) }}</span>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="module-name">
|
|
|
|
+ <span class="label">模块名称:</span>
|
|
|
|
+ <span class="value">{{ it.dcb_name }}</span>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </template>
|
|
|
|
+ </transition-group>
|
|
|
|
+ </draggable>
|
|
|
|
+ </div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!-- 新增资源选择弹框 -->
|
|
<!-- 新增资源选择弹框 -->
|
|
@@ -2644,41 +2682,51 @@ export default {
|
|
if (res.status != 200) return [];
|
|
if (res.status != 200) return [];
|
|
|
|
|
|
let dataList = res.data.dataList.map((item) => {
|
|
let dataList = res.data.dataList.map((item) => {
|
|
- // 添加空值检查
|
|
|
|
- if (!item.attrs) {
|
|
|
|
- item.attrs = "[]";
|
|
|
|
- }
|
|
|
|
- if (!item.content) {
|
|
|
|
- item.content = "";
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
try {
|
|
try {
|
|
- // 解析 attrs,添加错误处理
|
|
|
|
- item.attrs =
|
|
|
|
- typeof item.attrs === "string"
|
|
|
|
- ? JSON.parse(item.attrs)
|
|
|
|
|
|
+ // 处理属性值
|
|
|
|
+ if (item.dcb_attrs) {
|
|
|
|
+ // 如果存在 dcb_attrs,优先使用它并确保正确解析
|
|
|
|
+ item.attrs = typeof item.dcb_attrs === "string"
|
|
|
|
+ ? JSON.parse(item.dcb_attrs)
|
|
|
|
+ : item.dcb_attrs;
|
|
|
|
+ } else if (!item.attrs) {
|
|
|
|
+ // 如果既没有 dcb_attrs 也没有 attrs,设置为空数组
|
|
|
|
+ item.attrs = [];
|
|
|
|
+ } else {
|
|
|
|
+ // 如果有 attrs 但是是字符串,解析它
|
|
|
|
+ item.attrs = typeof item.attrs === "string"
|
|
|
|
+ ? JSON.parse(item.attrs)
|
|
: item.attrs;
|
|
: item.attrs;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ // 确保 content 存在
|
|
|
|
+ item.content = item.dcb_nr || item.content || "";
|
|
|
|
|
|
- // 从 content 中提取所有 {{}} 包裹的 ID,添加空值检查
|
|
|
|
- const contentIds = (
|
|
|
|
- (item.content || "").match(/{{([^}]+)}}/g) || []
|
|
|
|
- ).map((match) => match.slice(2, -2).trim());
|
|
|
|
|
|
+ // 从 content 中提取所有 {{}} 包裹的 ID
|
|
|
|
+ const contentIds = (item.content.match(/{{([^}]+)}}/g) || [])
|
|
|
|
+ .map(match => match.slice(2, -2).trim());
|
|
|
|
+
|
|
|
|
+ // 只在有 contentIds 时进行过滤
|
|
|
|
+ if (contentIds.length > 0) {
|
|
|
|
+ item.attrs = Array.isArray(item.attrs)
|
|
|
|
+ ? item.attrs.filter(attr => attr && attr.id && contentIds.includes(attr.id))
|
|
|
|
+ : [];
|
|
|
|
+ }
|
|
|
|
|
|
// 确保 attrs 是数组
|
|
// 确保 attrs 是数组
|
|
- item.attrs = Array.isArray(item.attrs) ? item.attrs : [];
|
|
|
|
|
|
+ if (!Array.isArray(item.attrs)) {
|
|
|
|
+ item.attrs = [];
|
|
|
|
+ }
|
|
|
|
|
|
- // 过滤 attrs,只保留在 content 中出现的 ID
|
|
|
|
- item.attrs = item.attrs.filter(
|
|
|
|
- (attr) => attr && attr.id && contentIds.includes(attr.id)
|
|
|
|
- );
|
|
|
|
} catch (error) {
|
|
} catch (error) {
|
|
- console.error("Error processing template item:", error);
|
|
|
|
|
|
+ console.error("Error processing template item:", error, item);
|
|
item.attrs = [];
|
|
item.attrs = [];
|
|
}
|
|
}
|
|
|
|
|
|
return item;
|
|
return item;
|
|
});
|
|
});
|
|
-
|
|
|
|
|
|
+
|
|
|
|
+ console.log("处理后的数据列表:", dataList);
|
|
return dataList;
|
|
return dataList;
|
|
},
|
|
},
|
|
|
|
|
|
@@ -3093,7 +3141,101 @@ export default {
|
|
this.docAttr.links = JSON.stringify(this.docAttr.linkProduct);
|
|
this.docAttr.links = JSON.stringify(this.docAttr.linkProduct);
|
|
}
|
|
}
|
|
// ... 其他代码保持不变 ...
|
|
// ... 其他代码保持不变 ...
|
|
|
|
+ },
|
|
|
|
+ // 添加或修改以下方法
|
|
|
|
+ getCategory(categoryId) {
|
|
|
|
+ // 处理数组格式的categoryId
|
|
|
|
+ if (Array.isArray(categoryId)) {
|
|
|
|
+ categoryId = categoryId[categoryId.length - 1]; // 获取数组最后一个值
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ // 如果没有categoryId,直接返回空字符串
|
|
|
|
+ if (!categoryId) return '';
|
|
|
|
+
|
|
|
|
+ const findCategory = (list) => {
|
|
|
|
+ if (!list || !Array.isArray(list)) return null;
|
|
|
|
+
|
|
|
|
+ for (const category of list) {
|
|
|
|
+ // 确保进行数字比较
|
|
|
|
+ if (Number(category.id) === Number(categoryId) ||
|
|
|
|
+ Number(category.dcb_category_id) === Number(categoryId)) {
|
|
|
|
+ return category.name || category.dcb_name;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ // 检查templates
|
|
|
|
+ if (category.templates) {
|
|
|
|
+ const template = category.templates.find(t =>
|
|
|
|
+ Number(t.dcb_category_id) === Number(categoryId) ||
|
|
|
|
+ Number(t.category_id) === Number(categoryId)
|
|
|
|
+ );
|
|
|
|
+ if (template) {
|
|
|
|
+ return category.name;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ // 递归检查子分类
|
|
|
|
+ if (category.children) {
|
|
|
|
+ const found = findCategory(category.children);
|
|
|
|
+ if (found) return found;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ return null;
|
|
|
|
+ };
|
|
|
|
+
|
|
|
|
+ // 在分类列表中查找
|
|
|
|
+ const categoryName = findCategory(this.categoryList);
|
|
|
|
+
|
|
|
|
+ // 如果找到分类名称则返回,否则返回格式化后的分类ID
|
|
|
|
+ return categoryName || (categoryId ? String(categoryId) : '');
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ // 添加目录编号更新方法
|
|
|
|
+ updateDirectoryNumbers() {
|
|
|
|
+ this.coms.forEach((com, moduleIndex) => {
|
|
|
|
+ if (com.attrs) {
|
|
|
|
+ // 获取当前模块中的所有目录类型属性
|
|
|
|
+ const directoryAttrs = com.attrs.filter(attr => attr.type === 'Directory');
|
|
|
|
+
|
|
|
|
+ // 更新每个目录的编号
|
|
|
|
+ directoryAttrs.forEach((dir, index) => {
|
|
|
|
+ // 生成新的编号
|
|
|
|
+ const number = this.generateLevelPrefix(moduleIndex, dir.level);
|
|
|
|
+ // 更新目录编号
|
|
|
|
+ this.$set(dir, 'number', number);
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ // 简化拖拽完成处理
|
|
|
|
+ onDragComplete() {
|
|
|
|
+ this.$nextTick(() => {
|
|
|
|
+ // 只在存在目录类型的属性时才更新编号
|
|
|
|
+ if (this.coms.some(com => com.attrs && com.attrs.some(attr => attr.type === 'Directory'))) {
|
|
|
|
+ this.updateDirectoryNumbers();
|
|
|
|
+ }
|
|
|
|
+ // 触发重建事件
|
|
|
|
+ this.$emit("onRebuild", this.coms);
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ // 简化拖拽结束处理
|
|
|
|
+ onDragEnd() {
|
|
|
|
+ // 可以添加其他拖拽结束后的处理逻辑
|
|
|
|
+ this.$forceUpdate();
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ // 简化添加处理
|
|
|
|
+ onAdd(evt) {
|
|
|
|
+ console.log('Added new module:', evt.added);
|
|
|
|
+ this.$nextTick(() => {
|
|
|
|
+ if (this.coms.some(com => com.attrs && com.attrs.some(attr => attr.type === 'Directory'))) {
|
|
|
|
+ this.updateDirectoryNumbers();
|
|
|
|
+ }
|
|
|
|
+ this.$emit("onRebuild", this.coms);
|
|
|
|
+ });
|
|
}
|
|
}
|
|
|
|
+
|
|
},
|
|
},
|
|
};
|
|
};
|
|
</script>
|
|
</script>
|
|
@@ -3191,4 +3333,54 @@ export default {
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
+.module-list-container {
|
|
|
|
+/* border: 1px solid #dcdfe6; */
|
|
|
|
+ border-radius: 4px;
|
|
|
|
+ padding: 10px;
|
|
|
|
+
|
|
|
|
+ .module-item {
|
|
|
|
+ display: flex;
|
|
|
|
+ align-items: center;
|
|
|
|
+ padding: 10px;
|
|
|
|
+ border-bottom: 1px solid #ebeef5;
|
|
|
|
+
|
|
|
|
+ &:last-child {
|
|
|
|
+ border-bottom: none;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ &.active-module {
|
|
|
|
+ background-color: #f5f7fa;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .drag-handle {
|
|
|
|
+ cursor: move;
|
|
|
|
+ margin-right: 15px;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .module-info {
|
|
|
|
+ flex: 1;
|
|
|
|
+
|
|
|
|
+ .module-category,
|
|
|
|
+ .module-name {
|
|
|
|
+ display: flex;
|
|
|
|
+ align-items: center;
|
|
|
|
+ margin-bottom: 5px;
|
|
|
|
+
|
|
|
|
+ &:last-child {
|
|
|
|
+ margin-bottom: 0;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .label {
|
|
|
|
+ color: #606266;
|
|
|
|
+ margin-right: 10px;
|
|
|
|
+ min-width: 70px;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .value {
|
|
|
|
+ color: #303133;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+}
|
|
</style>
|
|
</style>
|