From 010db1e7bcd742c8416349ebe8771dd3f4b8db16 Mon Sep 17 00:00:00 2001
From: 2910410219 <2910410219@qq.com>
Date: Fri, 22 May 2026 18:20:39 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E4=BC=98=E5=8C=96=E5=88=9B?=
 =?UTF-8?q?=E4=BD=9C=E9=A1=B5=E9=9D=A2=E6=96=87=E4=BB=B6=E4=B8=8A=E4=BC=A0?=
 =?UTF-8?q?=E9=80=BB=E8=BE=91=E4=B8=8E=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 调整了文件上传按钮的样式和结构，提升了可读性。
- 规范化了文件上传状态管理，确保用户体验一致性。
- 更新了动态表单值处理逻辑，支持更灵活的字段扩展管理。
- 清理了动态表单值，确保在节点切换时正确重置相关字段。
---
 src/views/settings/creation/index.vue | 105 +++++++++++++++++++-------
 1 file changed, 78 insertions(+), 27 deletions(-)

diff --git a/src/views/settings/creation/index.vue b/src/views/settings/creation/index.vue
index f6e693b..0fa7390 100644
--- a/src/views/settings/creation/index.vue
+++ b/src/views/settings/creation/index.vue
@@ -1,4 +1,4 @@
-<template>
+<template>
 	<div class="creation-page" :class="{ 'creation-mode': isCreationMode }">
 		<!-- 左侧面板：工作空间/当前选中元素 Tab切换 -->
 		<div class="panel left">
@@ -352,7 +352,13 @@
 																	:accept="getCreationFileAccept(field)"
 																	:on-change="(file: any) => handleCreationFieldUpload(node, field, file)"
 																>
-																	<el-button size="small" type="primary" :loading="isCreationFieldUploading(node, field)" :disabled="isFromWorkspace || isCreationFieldUploading(node, field)">{{ isCreationFieldUploading(node, field) ? '上传中...' : '选择文件' }}</el-button>
+																	<el-button
+																		size="small"
+																		type="primary"
+																		:loading="isCreationFieldUploading(node, field)"
+																		:disabled="isFromWorkspace || isCreationFieldUploading(node, field)"
+																		>{{ isCreationFieldUploading(node, field) ? '上传中...' : '选择文件' }}</el-button
+																	>
 																</el-upload>
 															</div>
 															<div class="creation-upload-tags">
@@ -360,7 +366,11 @@
 																<span class="creation-upload-tag count">已上传 {{ getCreationFileCountText(node, field) }}</span>
 															</div>
 															<div v-if="getCreationFieldFiles(node, field).length > 0" class="uploaded-files-list creation-upload-list">
-																<div v-for="(uploadedFile, fileIdx) in getCreationFieldFiles(node, field)" :key="fileIdx" class="uploaded-file-item creation-upload-item">
+																<div
+																	v-for="(uploadedFile, fileIdx) in getCreationFieldFiles(node, field)"
+																	:key="fileIdx"
+																	class="uploaded-file-item creation-upload-item"
+																>
 																	<span class="file-name">{{ uploadedFile.name }}</span>
 																	<el-button
 																		type="danger"
@@ -1799,7 +1809,7 @@ const handleCreationFieldUpload = async (node: any, field: any, file: any) => {
 		creationFieldFiles[key].push({ name: file.name, url: fileUrl });
 		creationFormValues[key] = creationFieldFiles[key].map((f) => f.url);
 		ElMessage.success('文件上传成功');
-		} catch (error: any) {
+	} catch (error: any) {
 		ElMessage.error(error?.message || '文件上传失败');
 	} finally {
 		creationFieldUploading[key] = false;
@@ -1945,7 +1955,9 @@ const sendMessage = async () => {
 									value:
 										bodyItem.fieldType === 'fileUpload'
 											? Array.isArray(userVal !== undefined ? userVal : bodyItem.value)
-												? (userVal !== undefined ? userVal : bodyItem.value)
+												? userVal !== undefined
+													? userVal
+													: bodyItem.value
 												: userVal !== undefined
 													? [userVal]
 													: bodyItem.value
@@ -2130,13 +2142,13 @@ const handleTreeNodeClick = async (data: TreeNode) => {
 									creationFormValues[fieldKey] = Boolean(field.value);
 								} else {
 									creationFormValues[fieldKey] =
-									field.type === 'upload' || field.type === 'uploadMultiple' || field.type === 'fileUpload'
-										? Array.isArray(field.value)
-											? field.value
-											: field.value
-												? [field.value]
-												: []
-										: field.value || '';
+										field.type === 'upload' || field.type === 'uploadMultiple' || field.type === 'fileUpload'
+											? Array.isArray(field.value)
+												? field.value
+												: field.value
+													? [field.value]
+													: []
+											: field.value || '';
 								}
 							});
 						}
@@ -2214,13 +2226,13 @@ const handleTreeNodeClick = async (data: TreeNode) => {
 									creationFormValues[fieldKey] = Boolean(field.value);
 								} else {
 									creationFormValues[fieldKey] =
-									field.type === 'upload' || field.type === 'uploadMultiple' || field.type === 'fileUpload'
-										? Array.isArray(field.value)
-											? field.value
-											: field.value
-												? [field.value]
-												: []
-										: field.value || '';
+										field.type === 'upload' || field.type === 'uploadMultiple' || field.type === 'fileUpload'
+											? Array.isArray(field.value)
+												? field.value
+												: field.value
+													? [field.value]
+													: []
+											: field.value || '';
 								}
 							});
 						}
@@ -2406,12 +2418,18 @@ const isHttpExpandTriggerField = (fieldItem: any) => {
 };
 const openHttpExpandDialog = (fieldItem: any) => {
 	if (!Array.isArray(fieldItem?.expand)) return;
+	const nodeId = selectedElement.value?.id;
+	if (!nodeId) return;
+
 	currentHttpExpandFields.value = fieldItem.expand;
 	Object.keys(httpExpandFormValues).forEach((k) => delete httpExpandFormValues[k]);
 	Object.keys(httpExpandKeyValuePairs).forEach((k) => delete httpExpandKeyValuePairs[k]);
+
 	fieldItem.expand.forEach((f: any) => {
-		httpExpandFormValues[f.field] = dynamicFormValues[f.field] !== undefined ? dynamicFormValues[f.field] : (f.default ?? '');
+		const expandKey = `${nodeId}_responseType_expand_${f.field}`;
+		httpExpandFormValues[f.field] = dynamicFormValues[expandKey] !== undefined ? dynamicFormValues[expandKey] : '';
 	});
+
 	showHttpExpandDialog.value = true;
 };
 const getHttpExpandKeyValuePairs = (field: string) => {
@@ -2454,12 +2472,28 @@ const removeHttpExpandKeyValuePair = (field: string, index: number) => {
 	updateHttpExpandKeyValueField(field);
 };
 const confirmHttpExpandDialog = () => {
+	const nodeId = selectedElement.value?.id;
+	if (!nodeId) return;
+
 	currentHttpExpandFields.value.forEach((f: any) => {
-		dynamicFormValues[f.field] = httpExpandFormValues[f.field];
+		const expandKey = `${nodeId}_responseType_expand_${f.field}`;
+		dynamicFormValues[expandKey] = httpExpandFormValues[f.field];
 	});
+
 	showHttpExpandDialog.value = false;
 	ElMessage.success('主动拉取参数已保存');
 };
+const buildHttpResponseTypeExpandData = (responseTypeField: any, nodeId: string) => {
+	if (!Array.isArray(responseTypeField?.expand) || responseTypeField.expand.length === 0) return [];
+
+	return responseTypeField.expand.map((f: any) => {
+		const expandKey = `${nodeId}_responseType_expand_${f.field}`;
+		return {
+			...f,
+			value: dynamicFormValues[expandKey] !== undefined ? dynamicFormValues[expandKey] : '',
+		};
+	});
+};
 
 // HTTP请求体配置相关函数
 // 打开HTTP请求体配置弹窗
@@ -3182,12 +3216,14 @@ watch(
 		currentHttpBodyField.value = '';
 		showHttpBodyDialog.value = false;
 
-		// 重置 dynamicFormValues（不删除键，保持响应式）
-		for (const key in dynamicFormValues) {
-			dynamicFormValues[key] = '';
-		}
-
-		// 获取当前节点的基础表单字段（直接从 nodeSchemaMap 获取，避免响应式延迟）
+			// 重置 dynamicFormValues（不删除固定字段键，动态 expand 键按节点切换清理）
+			for (const key in dynamicFormValues) {
+				if (key.includes('_responseType_expand_')) {
+					delete dynamicFormValues[key];
+					continue;
+				}
+				dynamicFormValues[key] = '';
+			}
 		const currentNodeCode = formState.nodeCode;
 		const baseFormFields = nodeSchemaMap.value[currentNodeCode] || [];
 		const baseFieldNames = new Set(baseFormFields.map((f) => f.field));
@@ -3208,6 +3244,16 @@ watch(
 						// 其他类型：保持原值
 						dynamicFormValues[fieldConfig.field] = fieldConfig.value;
 					}
+					if (
+						String(e.properties.nodeCode || '').toLowerCase() === 'http' &&
+						fieldConfig.field === 'responseType' &&
+						Array.isArray(fieldConfig.expand)
+					) {
+						fieldConfig.expand.forEach((expandField: any) => {
+							const expandKey = `${e.id}_responseType_expand_${expandField.field}`;
+							dynamicFormValues[expandKey] = expandField.value !== undefined ? expandField.value : '';
+						});
+					}
 				} else {
 					// 自定义字段：加载到 customFields
 					const customType = fieldConfig.type === 'upload' ? 'uploadMultiple' : fieldConfig.type || 'input';
@@ -3460,6 +3506,11 @@ const applySelected = () => {
 				label: fieldItem.label,
 				value: normalizedValue,
 				required: fieldItem.required || false,
+				...(String(formState.nodeCode || '').toLowerCase() === 'http' && fieldItem.field === 'responseType' && normalizedValue === 'pull'
+					? {
+							expand: buildHttpResponseTypeExpandData(fieldItem, cur.id),
+						}
+					: {}),
 			});
 		});