135 lines
3.2 KiB
Vue
135 lines
3.2 KiB
Vue
<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>
|