From d9caf505c1b1687b4d80531f222cc2ca3574521e Mon Sep 17 00:00:00 2001
From: dengqichen <dengqichen@iscmtech.com>
Date: Mon, 8 Dec 2025 17:16:20 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E6=9C=8D=E5=8A=A1=E5=99=A8?=
 =?UTF-8?q?=E9=98=88=E5=80=BC=E8=A7=84=E5=88=99?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/LucideIconSelect/index.tsx | 64 +++++++++----------
 .../List/components/CategoryManageDialog.tsx  |  2 +-
 2 files changed, 33 insertions(+), 33 deletions(-)

diff --git a/frontend/src/components/LucideIconSelect/index.tsx b/frontend/src/components/LucideIconSelect/index.tsx
index d8f7dbbf..4a785cba 100644
--- a/frontend/src/components/LucideIconSelect/index.tsx
+++ b/frontend/src/components/LucideIconSelect/index.tsx
@@ -60,16 +60,38 @@ const LucideIconSelect: React.FC<LucideIconSelectProps> = ({
                     <DialogTitle>选择图标</DialogTitle>
                 </DialogHeader>
 
-                <div className="space-y-4 flex-1 flex flex-col overflow-hidden">
-                    {/* 搜索框 */}
-                    <div className="relative flex-shrink-0">
-                        <Search className="absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" />
-                        <Input
-                            placeholder="搜索图标名称..."
-                            value={search}
-                            onChange={(e) => setSearch(e.target.value)}
-                            className="pl-10"
-                        />
+                <div className="space-y-4 flex-1 flex flex-col overflow-hidden px-6 pb-6">
+                    {/* 搜索框和当前选中 */}
+                    <div className="flex items-center gap-3 flex-shrink-0">
+                        <div className="relative flex-1">
+                            <Search className="absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" />
+                            <Input
+                                placeholder="搜索图标名称..."
+                                value={search}
+                                onChange={(e) => setSearch(e.target.value)}
+                                className="pl-10"
+                            />
+                        </div>
+                        {/* 当前选中 */}
+                        {value && (
+                            <div className="flex items-center gap-2 px-3 py-2 border rounded-md bg-muted/50">
+                                <span className="text-sm text-muted-foreground whitespace-nowrap">当前选中:</span>
+                                <div className="flex items-center gap-2">
+                                    <DynamicIcon name={value} className="h-4 w-4" />
+                                    <code className="text-xs">{value}</code>
+                                </div>
+                                <Button
+                                    variant="ghost"
+                                    size="sm"
+                                    className="h-7 w-7 p-0"
+                                    onClick={() => {
+                                        onChange?.('');
+                                    }}
+                                >
+                                    ×
+                                </Button>
+                            </div>
+                        )}
                     </div>
 
                     {/* 分类标签 */}
@@ -130,28 +152,6 @@ const LucideIconSelect: React.FC<LucideIconSelectProps> = ({
                             </div>
                         </TabsContent>
                     </Tabs>
-
-                    {/* 当前选中 */}
-                    {value && (
-                        <div className="flex items-center gap-2 p-3 border rounded-md bg-muted/50 flex-shrink-0">
-                            <span className="text-sm text-muted-foreground">当前选中:</span>
-                            <div className="flex items-center gap-2">
-                                <DynamicIcon name={value} className="h-5 w-5" />
-                                <code className="text-sm">{value}</code>
-                            </div>
-                            <Button
-                                variant="ghost"
-                                size="sm"
-                                className="ml-auto"
-                                onClick={() => {
-                                    onChange?.('');
-                                    onOpenChange(false);
-                                }}
-                            >
-                                清除
-                            </Button>
-                        </div>
-                    )}
                 </div>
             </DialogContent>
         </Dialog>
diff --git a/frontend/src/pages/Resource/Server/List/components/CategoryManageDialog.tsx b/frontend/src/pages/Resource/Server/List/components/CategoryManageDialog.tsx
index 0d9519bf..c9c25d28 100644
--- a/frontend/src/pages/Resource/Server/List/components/CategoryManageDialog.tsx
+++ b/frontend/src/pages/Resource/Server/List/components/CategoryManageDialog.tsx
@@ -341,7 +341,7 @@ export const CategoryManageDialog: React.FC<CategoryManageDialogProps> = ({
                                             className="pl-8"
                                         />
                                     </div>
-                                    <Button onClick={handleSearch} variant="secondary">
+                                    <Button onClick={handleSearch} variant="outline">
                                         <Search className="h-4 w-4 mr-2" />
                                         搜索
                                     </Button>