init

src/views/knowledge/aiFlow/panels/TextPanel.vue

@@ -0,0 +1,139 @@
+<template>
+	<div class="panel-content">
+		<!-- 输入变量部分 -->
+		<div class="mb-2 panel-section">
+			<div class="flex justify-between items-center panel-header">
+				<span>变量输入</span>
+				<el-button type="primary" size="small" @click="addParam">
+					<el-icon>
+						<Plus />
+					</el-icon>
+					添加
+				</el-button>
+			</div>
+
+			<div class="params-list">
+				<div v-for="(param, index) in inputParams" :key="index" class="mb-2">
+					<div class="param-item">
+						<el-row :gutter="12">
+							<el-col :span="9">
+								<el-input v-model="param.name" placeholder="变量名" />
+							</el-col>
+							<el-col :span="12">
+								<el-select v-model="param.type" placeholder="变量值">
+									<el-option-group v-for="item in previousOutputParams" :key="item.name" :label="item.name">
+										<el-option v-for="param in item.list" :key="param.name" :label="param.name" :value="`${item.id}.${param.name}`" />
+									</el-option-group>
+								</el-select>
+							</el-col>
+							<el-col :span="3">
+								<el-button @click="removeParam(index)">
+									<el-icon>
+										<Delete />
+									</el-icon>
+								</el-button>
+							</el-col>
+						</el-row>
+					</div>
+				</div>
+			</div>
+		</div>
+
+		<!-- 文本内容编辑 -->
+		<div class="mb-2 panel-section">
+			<div class="panel-header">
+				<span>文本内容</span>
+			</div>
+			<div class="text-editor">
+				<el-input
+					v-model="node.textParams.content"
+					type="textarea"
+					:rows="8"
+					placeholder="请输入要返回的固定文本内容..."
+					show-word-limit
+					maxlength="5000"
+				/>
+			</div>
+			<div class="text-tips">
+				<el-alert
+					title="提示：此节点将返回您设置的固定文本内容，可用于流程中的固定消息、说明文字等场景。"
+					type="info"
+					:closable="false"
+					show-icon
+				/>
+			</div>
+		</div>
+
+		<!-- 输出变量配置 -->
+		<div class="mb-2 panel-section">
+			<div class="panel-header">
+				<span>输出变量</span>
+			</div>
+			<div class="params-list">
+				<div v-for="(param, index) in outputParams" :key="index" class="mb-2">
+					<div class="param-item readonly">
+						<el-row :gutter="12">
+							<el-col :span="9">
+								<el-input v-model="param.name" :disabled="true" placeholder="变量名" />
+							</el-col>
+							<el-col :span="12">
+								<el-input v-model="param.type" :disabled="true" placeholder="变量类型" />
+							</el-col>
+						</el-row>
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
+</template>
+
+<script>
+import { Plus, Delete } from '@element-plus/icons-vue';
+import common from './common.ts';
+import './panel.css';
+
+export default {
+	name: 'TextPanel',
+	components: {
+		Plus,
+		Delete,
+	},
+	mixins: [common],
+	watch: {
+		// 监听节点参数变化，确保节点有正确的默认参数
+		'node.textParams': {
+			handler() {
+				if (!this.node.textParams) {
+					this.$set(this.node, 'textParams', { content: '' });
+				}
+			},
+			immediate: true,
+			deep: true,
+		},
+	},
+	created() {
+		// 确保节点有textParams属性
+		if (!this.node.textParams) {
+			this.$set(this.node, 'textParams', { content: '' });
+		}
+	},
+};
+</script>
+
+<style scoped>
+.text-editor {
+	margin-bottom: 12px;
+}
+
+.text-tips {
+	margin-top: 8px;
+}
+
+.param-item.readonly {
+	opacity: 0.6;
+}
+
+.param-item.readonly .el-input {
+	background-color: #f5f7fa;
+}
+</style>