From 890adec7fddfe9d5f5da4511343ac6e8341d46b3 Mon Sep 17 00:00:00 2001
From: wujingjing <gersonwu@qq.com>
Date: 星期一, 16 十二月 2024 10:34:41 +0800
Subject: [PATCH] 可改变大小
---
src/components/vue-flow/ui/nodes/components/NodeBasicLayout.vue | 15 +++++++++------
src/components/vue-flow/ui/nodes/EndNode.vue | 1 +
src/components/vue-flow/ui/nodes/OutputNode.vue | 17 ++++++++++++++---
src/components/vue-flow/MainCanvas.vue | 10 ++++++++--
src/components/vue-flow/ui/nodes/StartNode.vue | 1 -
5 files changed, 32 insertions(+), 12 deletions(-)
diff --git a/src/components/vue-flow/MainCanvas.vue b/src/components/vue-flow/MainCanvas.vue
index 585d4d5..db9aabb 100644
--- a/src/components/vue-flow/MainCanvas.vue
+++ b/src/components/vue-flow/MainCanvas.vue
@@ -39,7 +39,7 @@
import CustomEdge from './ui/edges/CustomEdge.vue';
import { onMounted } from 'vue';
-const props = defineProps(['flowJson', 'agentNames','funcNames']);
+const props = defineProps(['flowJson', 'agentNames', 'funcNames']);
const nodeTypes = {
start: markRaw(StartNode),
@@ -157,14 +157,20 @@
@import '@vue-flow/minimap/dist/style.css';
@import '@vue-flow/node-resizer/dist/style.css';
-
#main-canvas {
--vf-handle: #2563eb;
--handle-size: 13px;
+ --resize-handle-size:8px;
.vue-flow__handle {
width: var(--handle-size);
height: var(--handle-size);
}
+
+ .vue-flow__resize-control.handle {
+ width: var(--resize-handle-size);
+ height: var(--resize-handle-size);
+ // visibility: hidden;
+ }
}
</style>
diff --git a/src/components/vue-flow/ui/nodes/EndNode.vue b/src/components/vue-flow/ui/nodes/EndNode.vue
index 9035ad1..2c665af 100644
--- a/src/components/vue-flow/ui/nodes/EndNode.vue
+++ b/src/components/vue-flow/ui/nodes/EndNode.vue
@@ -2,6 +2,7 @@
<NodeBasicLayout
v-model:title="data.title"
:type="NodeType.End"
+
:showOffset="false"
:description="VueFlowHelper.getConfigValue(data, 'description', '宸ヤ綔娴佽繍琛屽埌姝ょ粨鏉熴��')"
>
diff --git a/src/components/vue-flow/ui/nodes/OutputNode.vue b/src/components/vue-flow/ui/nodes/OutputNode.vue
index 052ed66..9799f76 100644
--- a/src/components/vue-flow/ui/nodes/OutputNode.vue
+++ b/src/components/vue-flow/ui/nodes/OutputNode.vue
@@ -1,11 +1,22 @@
<template>
- <NodeBasicLayout v-model:title="data.title" :type="NodeType.Output" :description="VueFlowHelper.getConfigValue(data, 'description', '鍙悜鐢ㄦ埛鍙戦�佹秷鎭紝骞朵笖鏀寔杩涜鏇翠赴瀵岀殑浜や簰锛屼緥濡傝姹傜敤鎴锋壒鍑嗚繘琛屾煇椤规晱鎰熸搷浣溿�佸厑璁哥敤鎴峰湪妯″瀷杈撳嚭鍐呭鐨勫熀纭�涓婄洿鎺ヤ慨鏀瑰苟鎻愪氦銆�')">
+ <NodeBasicLayout
+ :maxWidth="520"
+ v-model:title="data.title"
+ :type="NodeType.Output"
+ :description="
+ VueFlowHelper.getConfigValue(
+ data,
+ 'description',
+ '鍙悜鐢ㄦ埛鍙戦�佹秷鎭紝骞朵笖鏀寔杩涜鏇翠赴瀵岀殑浜や簰锛屼緥濡傝姹傜敤鎴锋壒鍑嗚繘琛屾煇椤规晱鎰熸搷浣溿�佸厑璁哥敤鎴峰湪妯″瀷杈撳嚭鍐呭鐨勫熀纭�涓婄洿鎺ヤ慨鏀瑰苟鎻愪氦銆�'
+ )
+ "
+ >
<Handle :id="targetHandleId" type="target" :position="Position.Left" />
<FieldLayout level="2" :title="VueFlowHelper.getParams(outputParams, 'output_msg').label">
<el-input
v-model="VueFlowHelper.getParams(outputParams, 'output_msg').value.msg"
type="textarea"
- :rows="4"
+ :autosize="{ minRows: 4, maxRows: 6 }"
:placeholder="VueFlowHelper.getParams(outputParams, 'output_msg').placeholder"
autocomplete="off"
>
@@ -18,7 +29,7 @@
<el-input
v-model="VueFlowHelper.getParams(outputParams, 'output_result').value.value"
type="textarea"
- :rows="4"
+ :autosize="{ minRows: 4, maxRows: 6 }"
v-if="VueFlowHelper.getParams(outputParams, 'output_result').value.type === InteractionType.Input"
>
</el-input>
diff --git a/src/components/vue-flow/ui/nodes/StartNode.vue b/src/components/vue-flow/ui/nodes/StartNode.vue
index 462cd7d..dcb3d2a 100644
--- a/src/components/vue-flow/ui/nodes/StartNode.vue
+++ b/src/components/vue-flow/ui/nodes/StartNode.vue
@@ -3,7 +3,6 @@
v-model:title="data.title"
:type="NodeType.Start"
:description="VueFlowHelper.getConfigValue(data, 'description', '宸ヤ綔娴佽繍琛岀殑璧峰鑺傜偣銆�')"
- maxWidth="540"
>
<FieldLayout :title="VueFlowHelper.getConfigValue(varListConfig, 'name', '娴佺▼鍙傛暟')">
<el-table class="flex-auto" :data="varList" border>
diff --git a/src/components/vue-flow/ui/nodes/components/NodeBasicLayout.vue b/src/components/vue-flow/ui/nodes/components/NodeBasicLayout.vue
index 883fb74..08832dd 100644
--- a/src/components/vue-flow/ui/nodes/components/NodeBasicLayout.vue
+++ b/src/components/vue-flow/ui/nodes/components/NodeBasicLayout.vue
@@ -1,9 +1,6 @@
<template>
- <NodeResizer />
- <div
- class="order-2 rounded-lg border-solid border-gray-100 bg-white p-3 shadow-md relative hover:border-blue-500 group"
- :style="{ maxWidth: `${maxWidth}px` }"
- >
+ <NodeResizer :maxHeight="maxHeight" :maxWidth="maxWidth" :minHeight="minHeight" :minWidth="minWidth" />
+ <div class="order-2 rounded-lg border-solid border-gray-100 bg-white p-3 shadow-md relative hover:border-blue-500 group h-full">
<div
class="group-hover:visible invisible flex absolute divide-y-[1.5px] divide-solid divide-gray-100 rounded-lg right-0 -top-0.5 translate-y-[-100%]"
style="box-shadow: 0 0 15px #dbdee6"
@@ -65,10 +62,16 @@
import { VueFlowConfig } from '../../VueFlowConfig';
import { deepClone } from '/@/utils/other';
+defineOptions({
+ inheritAttrs: false,
+});
const titleIsEdit = ref(false);
const props = defineProps({
- maxWidth: { type: String, default: '520' },
+ maxWidth: { type: Number },
+ maxHeight: { type: Number },
+ minWidth: { type: Number },
+ minHeight: { type: Number },
type: { type: String as PropType<NodeType>, required: true },
description: { type: String },
showOffset: {
--
Gitblit v1.9.3