From c1f86c20d2e50d5c6c2acc83d2b00874e6866b57 Mon Sep 17 00:00:00 2001
From: fofolee <fofolee@qq.com>
Date: Fri, 11 Apr 2025 11:00:20 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E7=BC=96=E6=8E=92=E4=B8=ADub?=
 =?UTF-8?q?rowser=E4=B8=8D=E6=94=AF=E6=8C=81=E6=B7=BB=E5=8A=A0=E5=A4=9A?=
 =?UTF-8?q?=E4=B8=AA=E5=90=8C=E6=A0=B7=E7=9A=84=E6=93=8D=E4=BD=9C=E7=9A=84?=
 =?UTF-8?q?BUG?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../composer/ubrowser/UBrowserOperations.vue  | 56 ++++++++++++-------
 1 file changed, 36 insertions(+), 20 deletions(-)

diff --git a/src/components/composer/ubrowser/UBrowserOperations.vue b/src/components/composer/ubrowser/UBrowserOperations.vue
index 37af6a4..0dcdbe4 100644
--- a/src/components/composer/ubrowser/UBrowserOperations.vue
+++ b/src/components/composer/ubrowser/UBrowserOperations.vue
@@ -14,12 +14,15 @@
               bordered
               class="action-card cursor-pointer"
               :class="{
-                'action-selected': selectedActionKeys.includes(actionKey),
+                'action-selected': actionCount[actionKey] > 0,
               }"
-              @click="toggleAction(actionKey)"
+              @click="addAction(actionKey)"
             >
               <div class="q-pa-xs text-caption text-wrap text-center">
                 {{ action.label }}
+                <q-badge v-if="actionCount[actionKey]" color="primary" floating>
+                  {{ actionCount[actionKey] }}
+                </q-badge>
               </div>
             </q-card>
           </div>
@@ -38,7 +41,7 @@
           <q-chip
             square
             removable
-            @remove="toggleAction(selectedActionKey)"
+            @remove="removeAction(index)"
             class="text-caption q-mb-sm"
             :style="{
               paddingLeft: '7px',
@@ -125,6 +128,13 @@ export default {
     selectedActionArgs() {
       return this.modelValue.map((x) => x.args);
     },
+    actionCount() {
+      const count = {};
+      this.selectedActionKeys.forEach((key) => {
+        count[key] = (count[key] || 0) + 1;
+      });
+      return count;
+    },
   },
   methods: {
     moveAction(index, direction) {
@@ -138,26 +148,25 @@ export default {
         this.$emit("update:model-value", newOperation);
       }
     },
-    toggleAction(actionKey) {
-      const index = this.selectedActionKeys.indexOf(actionKey);
+    addAction(actionKey) {
       let newOperation = [...this.modelValue];
-      if (index !== -1) {
-        // 移除操作
-        newOperation.splice(index, 1);
-      } else {
-        // 添加操作
-        const { config, value } = this.operationsMap[actionKey];
-        const args = config?.length
-          ? config.map((field) => field.defaultValue)
-          : [];
+      // 添加操作
+      const { config, value } = this.operationsMap[actionKey];
+      const args = config?.length
+        ? config.map((field) => field.defaultValue)
+        : [];
 
-        const newOperationItem = { value, args };
-        if (actionKey !== value) {
-          newOperationItem.key = actionKey;
-        }
-
-        newOperation.push(newOperationItem);
+      const newOperationItem = { value, args };
+      if (actionKey !== value) {
+        newOperationItem.key = actionKey;
       }
+
+      newOperation.push(newOperationItem);
+      this.$emit("update:model-value", newOperation);
+    },
+    removeAction(index) {
+      let newOperation = [...this.modelValue];
+      newOperation.splice(index, 1);
       this.$emit("update:model-value", newOperation);
     },
     updateActionArgs(argvIndex, argvVal, actionIndex) {
@@ -250,4 +259,11 @@ export default {
 .row.q-col-gutter-xs > * {
   padding: 2px;
 }
+
+.q-badge {
+  font-size: 10px;
+  padding: 2px 4px;
+  right: -4px;
+  top: -4px;
+}
 </style>