From 97a0ce2f9968b5dd09a251eaddd4dc74ec08f967 Mon Sep 17 00:00:00 2001
From: fofolee <fofolee@qq.com>
Date: Mon, 30 Dec 2024 14:48:08 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E5=8F=AF=E7=94=A8=E9=87=8C?=
 =?UTF-8?q?=E9=9D=A2=E5=88=97=E8=A1=A8=E6=90=9C=E7=B4=A2=E4=BD=93=E9=AA=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../editor/composer/ComposerList.vue          | 38 +++++++++++++++----
 1 file changed, 30 insertions(+), 8 deletions(-)

diff --git a/src/components/editor/composer/ComposerList.vue b/src/components/editor/composer/ComposerList.vue
index 6b49544..21b1158 100644
--- a/src/components/editor/composer/ComposerList.vue
+++ b/src/components/editor/composer/ComposerList.vue
@@ -7,6 +7,8 @@
         borderless
         placeholder="搜索命令..."
         class="search-input"
+        ref="searchInput"
+        autofocus
       >
         <template v-slot:prepend>
           <q-icon name="search" size="sm" />
@@ -24,7 +26,8 @@
             <q-expansion-item
               :label="category.label"
               :icon="category.icon"
-              :default-opened="!!searchQuery || category.defaultOpened"
+              :model-value="isExpanded(category)"
+              @update:model-value="updateExpanded(category, $event)"
               dense-toggle
               class="category-item"
               header-class="category-header"
@@ -83,6 +86,7 @@ export default defineComponent({
     return {
       commandCategories,
       searchQuery: "",
+      expandedCategories: new Set(),
     };
   },
   computed: {
@@ -90,7 +94,7 @@ export default defineComponent({
       if (!this.searchQuery) return this.commandCategories;
 
       const query = this.searchQuery.toLowerCase();
-      return this.commandCategories
+      const filtered = this.commandCategories
         .map((category) => ({
           ...category,
           commands: this.commands
@@ -99,14 +103,17 @@ export default defineComponent({
                 (cmd.label && pinyinMatch.match(cmd.label, query)) ||
                 (cmd.value && pinyinMatch.match(cmd.value, query))
             )
-            .filter((cmd) =>
-              category.commands.some(
-                (catCmd) =>
-                  catCmd.value === cmd.value || catCmd.value === cmd.cmd
-              )
-            ),
+            .filter((cmd) => cmd.type === category.label),
         }))
         .filter((category) => category.commands.length > 0);
+
+      if (filtered.length > 0) {
+        filtered.forEach((category) => {
+          this.expandedCategories.add(category.label);
+        });
+      }
+
+      return filtered;
     },
   },
   methods: {
@@ -147,6 +154,21 @@ export default defineComponent({
         text.slice(end + 1)
       );
     },
+    isExpanded(category) {
+      return (
+        category.defaultOpened || this.expandedCategories.has(category.label)
+      );
+    },
+    updateExpanded(category, value) {
+      if (value) {
+        this.expandedCategories.add(category.label);
+      } else {
+        this.expandedCategories.delete(category.label);
+      }
+    },
+  },
+  mounted() {
+    this.$refs.searchInput.focus();
   },
 });
 </script>