From e71d7081a8ef12e89610958fbc8cae8cdf74cd14 Mon Sep 17 00:00:00 2001
From: fofolee <fofolee@qq.com>
Date: Wed, 12 Feb 2025 15:16:30 +0800
Subject: [PATCH] =?UTF-8?q?=E6=A0=B7=E5=BC=8F=E5=BE=AE=E8=B0=83=EF=BC=8C?=
 =?UTF-8?q?=E5=86=97=E4=BD=99=E4=BB=A3=E7=A0=81=E6=B8=85=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/card/CommandTypeTag.vue           | 10 +++++-----
 src/components/composer/ComposerCard.vue         |  2 +-
 src/components/composer/ComposerFlow.vue         |  5 -----
 src/components/composer/card/OutputEditor.vue    |  9 +--------
 src/components/composer/flow/ComposerButtons.vue |  8 +++++++-
 src/components/composer/flow/DropArea.vue        |  7 +++++--
 6 files changed, 19 insertions(+), 22 deletions(-)

diff --git a/src/components/card/CommandTypeTag.vue b/src/components/card/CommandTypeTag.vue
index df48d58..6827afc 100644
--- a/src/components/card/CommandTypeTag.vue
+++ b/src/components/card/CommandTypeTag.vue
@@ -114,8 +114,8 @@ export default {
       // window类型的额外应用数量标签的宽度
       for (let i = 0; i < visibleTagCount; i++) {
         const cmd = this.cmds[i];
-        if (cmd.type === 'window' && cmd.match.app.length > 1) {
-          extraBadgesWidth += 31;  // 额外应用数量标签的宽度
+        if (cmd.type === "window" && cmd.match.app.length > 1) {
+          extraBadgesWidth += 31; // 额外应用数量标签的宽度
         }
       }
 
@@ -163,7 +163,7 @@ export default {
           width += 1;
         }
       }
-      return width * 6;  // 假设每个英文字符宽度为6px
+      return width * 6; // 假设每个英文字符宽度为6px
     },
     // 判断是否需要显示tooltip（文本是否溢出）
     needTooltip(cmd) {
@@ -182,8 +182,8 @@ export default {
       }
 
       // 计算文本是否超出可用宽度
-      const iconWidth = 20;      // 图标宽度
-      const paddingWidth = 16;   // 内边距宽度
+      const iconWidth = 20; // 图标宽度
+      const paddingWidth = 16; // 内边距宽度
       const availableWidth = this.maxTagWidth - iconWidth - paddingWidth;
 
       return this.getTextWidth(text) > availableWidth;
diff --git a/src/components/composer/ComposerCard.vue b/src/components/composer/ComposerCard.vue
index 5e9212a..f7fbc80 100644
--- a/src/components/composer/ComposerCard.vue
+++ b/src/components/composer/ComposerCard.vue
@@ -90,7 +90,7 @@
 </template>
 
 <script>
-import { defineComponent, inject, provide, computed } from "vue";
+import { defineComponent, provide, computed } from "vue";
 import VariableInput from "components/composer/common/VariableInput.vue";
 import MultiParams from "components/composer/MultiParams.vue";
 import CommandHead from "components/composer/card/CommandHead.vue";
diff --git a/src/components/composer/ComposerFlow.vue b/src/components/composer/ComposerFlow.vue
index 7885354..a6ff593 100644
--- a/src/components/composer/ComposerFlow.vue
+++ b/src/components/composer/ComposerFlow.vue
@@ -568,7 +568,6 @@ export default defineComponent({
 
 .command-flow-container {
   padding: 8px;
-  background-color: rgba(255, 255, 255, 0.8);
   border-radius: 4px;
   transition: all 0.3s ease;
   display: flex;
@@ -576,10 +575,6 @@ export default defineComponent({
   position: relative;
 }
 
-.body--dark .command-flow-container {
-  background-color: rgba(32, 32, 32, 0.8);
-}
-
 /* 滑动淡出动画 */
 .slide-fade-enter-active,
 .slide-fade-leave-active {
diff --git a/src/components/composer/card/OutputEditor.vue b/src/components/composer/card/OutputEditor.vue
index 07ab494..c9149c7 100644
--- a/src/components/composer/card/OutputEditor.vue
+++ b/src/components/composer/card/OutputEditor.vue
@@ -203,12 +203,6 @@ export default defineComponent({
         (cmd) => cmd.value === this.command.value
       );
     },
-    defaultOutputVariable() {
-      return (
-        this.currentSubCommand?.defaultOutputVariable ||
-        this.command.defaultOutputVariable
-      );
-    },
     commandName() {
       return this.currentSubCommand.label || this.command.label;
     },
@@ -256,8 +250,7 @@ export default defineComponent({
     },
   },
   methods: {
-    initOutputVars(value) {
-      const outputVariable = value || this.defaultOutputVariable;
+    initOutputVars(outputVariable) {
       // 初始化完整输出变量名
       if (!outputVariable) {
         this.simpleOutputVar = "";
diff --git a/src/components/composer/flow/ComposerButtons.vue b/src/components/composer/flow/ComposerButtons.vue
index 3591ab5..0fd7e97 100644
--- a/src/components/composer/flow/ComposerButtons.vue
+++ b/src/components/composer/flow/ComposerButtons.vue
@@ -1,7 +1,13 @@
 <template>
   <div class="composer-buttons">
     <div class="right-buttons">
-      <q-btn icon="close" dense flat v-close-popup v-if="showCloseButton">
+      <q-btn
+        icon="close"
+        dense
+        flat
+        v-if="showCloseButton"
+        @click="$emit('action', 'close')"
+      >
         <q-tooltip>退出可视化编排</q-tooltip>
       </q-btn>
       <q-btn
diff --git a/src/components/composer/flow/DropArea.vue b/src/components/composer/flow/DropArea.vue
index 1c0ac87..ec1eca9 100644
--- a/src/components/composer/flow/DropArea.vue
+++ b/src/components/composer/flow/DropArea.vue
@@ -48,13 +48,16 @@ export default defineComponent({
   justify-content: center;
   border: 2px dashed #e0e0e0;
   border-radius: 4px;
-  margin: 8px 0;
   transition: all 0.3s ease;
   flex: 1;
   user-select: none;
   transition: all 0.3s ease;
 }
 
+.drop-area:has(.add-area) {
+  margin: 8px 0;
+}
+
 .body--dark .drop-area {
   border-color: #676666;
 }
@@ -94,7 +97,7 @@ export default defineComponent({
   display: flex;
   align-items: center;
   justify-content: center;
-  color: grey
+  color: grey;
 }
 
 .add-area {