From 2ddd9f2856f9c9b7ba240919179e54b9c013f830 Mon Sep 17 00:00:00 2001
From: hu xiaotong <416314413@163.com>
Date: Wed, 2 Jul 2025 16:41:54 +0800
Subject: [PATCH] =?UTF-8?q?refactor(frontend):=20=E4=BC=98=E5=8C=96?=
 =?UTF-8?q?=E6=8A=93=E5=8C=85=E9=A1=B5=E9=9D=A2=E6=A0=B7=E5=BC=8F=E5=92=8C?=
 =?UTF-8?q?=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

-调整接口地址显示方式- 重构按钮布局，采用垂直排列
- 统一按钮样式，设置最小宽度和字体大小- 更新导出数据按钮样式
---
 frontend/package.json.md5          |  2 +-
 frontend/src/pages/CapturePage.tsx | 52 ++++++++++++++----------------
 2 files changed, 26 insertions(+), 28 deletions(-)

diff --git a/frontend/package.json.md5 b/frontend/package.json.md5
index 624a3ae..c4c8cd7 100644
--- a/frontend/package.json.md5
+++ b/frontend/package.json.md5
@@ -1 +1 @@
-ab1f461d7da532ffc0ddf7b22c308322
\ No newline at end of file
+98e3c997ed559906a235af48ee6be17d
\ No newline at end of file
diff --git a/frontend/src/pages/CapturePage.tsx b/frontend/src/pages/CapturePage.tsx
index 784cbde..fffb493 100644
--- a/frontend/src/pages/CapturePage.tsx
+++ b/frontend/src/pages/CapturePage.tsx
@@ -391,42 +391,40 @@ function CapturePage() {
                                 >
                                     {interfaces.map((iface) => (
                                         <Select.Option key={iface.name} value={iface.name}>
-                                            {iface.addresses.join(', ')}
+                                            {iface.addresses}
                                         </Select.Option>
                                     ))}
                                 </Select>
                             </div>
 
-                            <div style={{ display: 'flex', gap: 8 }}>
-                                <Button
-                                    type="primary"
-                                    icon={<PlayCircleOutlined />}
-                                    onClick={startCapture}
-                                    disabled={isCapturing || !selectedInterface}
-                                    loading={loading}
-                                    style={{ flex: 1, height: 32 }}
-                                >
-                                    开始抓包
-                                </Button>
-
-                                <Button
-                                    danger
-                                    icon={<StopOutlined />}
-                                    onClick={stopCapture}
-                                    disabled={!isCapturing}
-                                    loading={loading}
-                                    style={{ flex: 1, height: 32 }}
-                                >
-                                    停止抓包
-                                </Button>
-                            </div>
-
-                            <div style={{ marginTop: 12 }}>
+                            <div style={{ display: 'flex', flexDirection: 'column', gap: 8 }}>
+                                <div style={{ display: 'flex', gap: 8 }}>
+                                    <Button
+                                        type="primary"
+                                        icon={<PlayCircleOutlined />}
+                                        onClick={startCapture}
+                                        disabled={isCapturing || !selectedInterface}
+                                        loading={loading}
+                                        style={{ flex: 1, height: 32, minWidth: 0, fontSize: 12 }}
+                                    >
+                                        开始抓包
+                                    </Button>
+                                    <Button
+                                        danger
+                                        icon={<StopOutlined />}
+                                        onClick={stopCapture}
+                                        disabled={!isCapturing}
+                                        loading={loading}
+                                        style={{ flex: 1, height: 32, minWidth: 0, fontSize: 12 }}
+                                    >
+                                        停止抓包
+                                    </Button>
+                                </div>
                                 <Button
                                     icon={<DownloadOutlined />}
                                     onClick={exportData}
                                     disabled={!capturedData.length}
-                                    style={{ width: '100%', height: 32 }}>
+                                    style={{ width: '100%', height: 32, fontSize: 14 }}>
                                     导出数据
                                 </Button>
                             </div>