From e560f396c5df192a850653d34f540a794581fd68 Mon Sep 17 00:00:00 2001
From: Ocetars <ocetars@gmail.com>
Date: Wed, 3 Dec 2025 15:45:12 +0800
Subject: [PATCH] =?UTF-8?q?refactor(command):=20=E4=BC=98=E5=8C=96?=
 =?UTF-8?q?=E6=8C=87=E4=BB=A4=E9=A1=B5=E9=9D=A2=E5=B8=83=E5=B1=80=E5=B9=B6?=
 =?UTF-8?q?=E6=9B=B4=E6=96=B0=E5=86=B2=E7=AA=81=E8=AD=A6=E5=91=8A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 【布局优化】重新组织指令管理页面布局，将筛选器移至顶部独立行
- 【信息展示】将搜索栏与总指令数、已禁用指令数合并显示，提升页面空间利用率
- 【视觉更新】更新指令冲突警告样式
---
 .../i18n/locales/en-US/features/command.json  |  3 +-
 .../i18n/locales/zh-CN/features/command.json  |  3 +-
 dashboard/src/views/CommandPage.vue           | 82 ++++++++-----------
 3 files changed, 38 insertions(+), 50 deletions(-)

diff --git a/dashboard/src/i18n/locales/en-US/features/command.json b/dashboard/src/i18n/locales/en-US/features/command.json
index b20044e3c..aee2d9c45 100644
--- a/dashboard/src/i18n/locales/en-US/features/command.json
+++ b/dashboard/src/i18n/locales/en-US/features/command.json
@@ -74,6 +74,7 @@
     "disabled": "Disabled",
     "conflict": "Conflict",
     "byPlugin": "Filter by plugin",
-    "byPermission": "Filter by permission"
+    "byPermission": "Filter by permission",
+    "byStatus": "Filter by status"
   }
 }
diff --git a/dashboard/src/i18n/locales/zh-CN/features/command.json b/dashboard/src/i18n/locales/zh-CN/features/command.json
index da7fc259f..a2fad4203 100644
--- a/dashboard/src/i18n/locales/zh-CN/features/command.json
+++ b/dashboard/src/i18n/locales/zh-CN/features/command.json
@@ -74,6 +74,7 @@
     "disabled": "已禁用",
     "conflict": "有冲突",
     "byPlugin": "按插件筛选",
-    "byPermission": "按权限筛选"
+    "byPermission": "按权限筛选",
+    "byStatus": "按状态筛选"
   }
 }
diff --git a/dashboard/src/views/CommandPage.vue b/dashboard/src/views/CommandPage.vue
index 1bd9c23c3..09ec8f25e 100644
--- a/dashboard/src/views/CommandPage.vue
+++ b/dashboard/src/views/CommandPage.vue
@@ -265,52 +265,8 @@ onMounted(async () => {
     <v-col cols="12">
       <v-card variant="flat" style="background-color: transparent">
         <v-card-text style="padding: 0px 12px;">
-          <!-- Summary Cards -->
-          <v-row class="mb-4">
-            <v-col cols="12" sm="4">
-              <v-card class="rounded-lg" elevation="1">
-                <v-card-text class="text-center pa-3">
-                  <div class="text-h4 font-weight-bold text-primary">{{ summary.total }}</div>
-                  <div class="text-caption text-medium-emphasis">{{ tm('summary.total') }}</div>
-                </v-card-text>
-              </v-card>
-            </v-col>
-            <v-col cols="12" sm="4">
-              <v-card class="rounded-lg" elevation="1">
-                <v-card-text class="text-center pa-3">
-                  <div class="text-h4 font-weight-bold text-error">{{ summary.disabled }}</div>
-                  <div class="text-caption text-medium-emphasis">{{ tm('summary.disabled') }}</div>
-                </v-card-text>
-              </v-card>
-            </v-col>
-            <v-col cols="12" sm="4">
-              <v-card class="rounded-lg" elevation="1">
-                <v-card-text class="text-center pa-3">
-                  <div class="text-h4 font-weight-bold text-warning">{{ summary.conflicts }}</div>
-                  <div class="text-caption text-medium-emphasis">{{ tm('summary.conflicts') }}</div>
-                </v-card-text>
-              </v-card>
-            </v-col>
-          </v-row>
-
-          <!-- Search Bar -->
-          <div class="mb-4 d-flex flex-wrap align-center">
-            <div style="flex-grow: 1; min-width: 200px; max-width: 350px;">
-              <v-text-field
-                v-model="searchQuery"
-                density="compact"
-                :label="tm('search.placeholder')"
-                prepend-inner-icon="mdi-magnify"
-                variant="solo-filled"
-                flat
-                hide-details
-                single-line
-              />
-            </div>
-          </div>
-
-          <!-- Filters -->
-          <v-row class="mb-3">
+          <!-- Filters Row (Top) -->
+          <v-row class="mb-4" align="center">
             <v-col cols="12" sm="4" md="3">
               <v-select
                 v-model="pluginFilter"
@@ -345,6 +301,7 @@ onMounted(async () => {
                   { title: tm('filters.disabled'), value: 'disabled' },
                   { title: tm('filters.conflict'), value: 'conflict' }
                 ]"
+                :label="tm('filters.byStatus')"
                 density="compact"
                 variant="outlined"
                 hide-details
@@ -352,11 +309,40 @@ onMounted(async () => {
             </v-col>
           </v-row>
 
+          <!-- Search Bar + Summary Stats Row -->
+          <div class="mb-4 d-flex flex-wrap align-center ga-4">
+            <div style="min-width: 200px; max-width: 350px; flex: 1; border: 1px solid #B9B9B9; border-radius: 16px;">
+              <v-text-field
+                v-model="searchQuery"
+                density="compact"
+                :label="tm('search.placeholder')"
+                prepend-inner-icon="mdi-magnify"
+                variant="solo-filled"
+                flat
+                hide-details
+                single-line
+              />
+            </div>
+            <div class="d-flex align-center ga-4">
+              <div class="d-flex align-center">
+                <v-icon size="18" color="primary" class="mr-1">mdi-console-line</v-icon>
+                <span class="text-body-2 text-medium-emphasis mr-1">{{ tm('summary.total') }}:</span>
+                <span class="text-body-1 font-weight-bold text-primary">{{ summary.total }}</span>
+              </div>
+              <v-divider vertical class="mx-1" style="height: 20px;" />
+              <div class="d-flex align-center">
+                <v-icon size="18" color="error" class="mr-1">mdi-close-circle-outline</v-icon>
+                <span class="text-body-2 text-medium-emphasis mr-1">{{ tm('summary.disabled') }}:</span>
+                <span class="text-body-1 font-weight-bold text-error">{{ summary.disabled }}</span>
+              </div>
+            </div>
+          </div>
+          
           <!-- Conflict Warning Alert -->
           <v-alert
             v-if="summary.conflicts > 0"
-            type="warning"
-            variant="flat"
+            type="error"
+            variant="tonal"
             class="mb-4"
             prominent
             border="start"