docs: 同步项目结构图，补充 components/AboutWindow.qml

AGENTS.md

@@ -73,7 +73,9 @@ then restart `dde-shell` (it discovers applets by scanning the install dir for
 │   └── networkmonitorapplet.cpp   # C++ backend implementation
 ├── package/
 │   ├── metadata.json.in           # Plugin metadata 模板（由 CMake 生成 metadata.json）
-│   └── networkview.qml            # QML UI
+│   ├── networkview.qml            # QML UI 主入口
+│   └── components/                # 拆分出的子组件
+│       └── AboutWindow.qml        # 关于窗口组件
 ├── docs/                          # Design docs and implementation plans
 └── AGENTS.md                      # This file
 ```

CMakeLists.txt

@@ -43,4 +43,9 @@ install(TARGETS space.jokul.JNetApplet DESTINATION /usr/lib/x86_64-linux-gnu/dde
 # configure_file 在构建目录生成最终 metadata.json，install 安装生成文件
 configure_file(package/metadata.json.in ${CMAKE_CURRENT_BINARY_DIR}/metadata.json @ONLY)
 install(FILES ${CMAKE_CURRENT_BINARY_DIR}/metadata.json DESTINATION /usr/share/dde-shell/${PLUGIN_ID})
-install(FILES package/networkview.qml DESTINATION /usr/share/dde-shell/${PLUGIN_ID})
+install(FILES package/networkview.qml DESTINATION /usr/share/dde-shell/${PLUGIN_ID})
+
+# 安装 components 子目录下所有 QML 组件
+# 设计原因：拆分出的子组件需随主 QML 一起安装到 dde-shell 插件目录，
+# 否则 networkview.qml 的 import "components" 在运行时找不到类型
+install(DIRECTORY package/components DESTINATION /usr/share/dde-shell/${PLUGIN_ID})

README.md

@@ -70,7 +70,9 @@ bash build-deb.sh
 │   └── networkmonitorapplet.cpp            # C++ 后端实现
 ├── package/
 │   ├── metadata.json.in                   # 插件元数据模板（由 CMake 生成 metadata.json）
-│   └── networkview.qml                     # QML 界面
+│   ├── networkview.qml                    # QML 界面主入口
+│   └── components/                        # 拆分出的子组件
+│       └── AboutWindow.qml                # 关于窗口组件
 ├── docs/                                   # 设计文档与实现计划
 ├── README.md                               # 本文件
 └── AGENTS.md                               # AI 代理工作指引

package/components/AboutWindow.qml

@@ -0,0 +1,167 @@
+// SPDX-FileCopyrightText: 2024 MyCompany
+//
+// SPDX-License-Identifier: LGPL-3.0-or-later
+
+// 关于窗口：独立顶层窗口，桌面居中弹出，展示插件信息
+// 从 networkview.qml 抽取，由父组件实例化并调用 show() 触发
+// 对外依赖：accentColor（关闭按钮 hover 高亮色），由父组件传入
+import QtQuick 2.15
+import QtQuick.Layouts 1.15
+import QtQuick.Window 2.15
+
+Window {
+    id: root
+
+    // 对外依赖：关闭按钮 hover 态文字高亮色，由父组件传入
+    // 默认值与 networkview.qml 中 root.accentRed 一致，确保独立可用
+    property color accentColor: Qt.rgba(220 / 255, 38 / 255, 38 / 255, 1)
+
+    width: 320
+    height: 230
+    visible: false
+    flags: Qt.FramelessWindowHint | Qt.Window
+    modality: Qt.NonModal
+    color: "transparent"
+
+    onVisibleChanged: {
+        if (visible) {
+            x = (Screen.width - width) / 2
+            y = (Screen.height - height) / 2
+        }
+    }
+
+    Rectangle {
+        anchors.fill: parent
+        color: "#f5f5f5"
+        radius: 12
+        border.width: 1
+        border.color: "#e0e0e0"
+
+        ColumnLayout {
+            anchors.fill: parent
+            anchors.margins: 0
+            spacing: 0
+
+            // 自定义标题栏（可拖动）
+            Rectangle {
+                Layout.fillWidth: true
+                Layout.preferredHeight: 44
+                color: "transparent"
+
+                MouseArea {
+                    anchors.fill: parent
+                    drag.target: root
+                }
+
+                Text {
+                    anchors.left: parent.left
+                    anchors.leftMargin: 16
+                    anchors.verticalCenter: parent.verticalCenter
+                    text: qsTr("关于")
+                    font.pixelSize: 15
+                    font.weight: Font.Bold
+                    color: "#333333"
+                }
+
+                Rectangle {
+                    anchors.right: parent.right
+                    anchors.rightMargin: 12
+                    anchors.verticalCenter: parent.verticalCenter
+                    width: 28
+                    height: 28
+                    radius: 14
+                    color: aboutCloseMouse.containsMouse ? Qt.rgba(220/255, 38/255, 38/255, 0.15) : "transparent"
+
+                    Text {
+                        anchors.centerIn: parent
+                        text: "×"
+                        font.pixelSize: 20
+                        font.weight: Font.Bold
+                        color: aboutCloseMouse.containsMouse ? accentColor : "#666666"
+                    }
+
+                    MouseArea {
+                        id: aboutCloseMouse
+                        anchors.fill: parent
+                        hoverEnabled: true
+                        cursorShape: Qt.PointingHandCursor
+                        onClicked: root.hide()
+                    }
+                }
+            }
+
+            // 内容区
+            ColumnLayout {
+                Layout.fillWidth: true
+                Layout.fillHeight: true
+                anchors.margins: 0
+                spacing: 10
+                Layout.leftMargin: 24
+                Layout.rightMargin: 24
+                Layout.topMargin: 4
+
+                // 标题组：插件名 + 英文名紧凑排列
+                ColumnLayout {
+                    spacing: 2
+                    Layout.alignment: Qt.AlignHCenter
+
+                    Text {
+                        text: qsTr("网络速度监控")
+                        font.pixelSize: 18
+                        font.weight: Font.Bold
+                        color: "#333333"
+                        Layout.alignment: Qt.AlignHCenter
+                    }
+
+                    Text {
+                        text: "JNetApplet"
+                        font.pixelSize: 12
+                        color: "#999999"
+                        Layout.alignment: Qt.AlignHCenter
+                    }
+                }
+
+                // 分隔线
+                Rectangle {
+                    Layout.fillWidth: true
+                    Layout.preferredHeight: 1
+                    color: "#e0e0e0"
+                }
+
+                // 信息行
+                ColumnLayout {
+                    spacing: 6
+                    Layout.fillWidth: true
+
+                    Text {
+                        text: qsTr("版本：1.0")
+                        font.pixelSize: 12
+                        color: "#666666"
+                    }
+
+                    Text {
+                        text: qsTr("作者：Jokul")
+                        font.pixelSize: 12
+                        color: "#666666"
+                    }
+
+                    Text {
+                        text: qsTr("描述：监控网络速度和流量")
+                        font.pixelSize: 12
+                        color: "#666666"
+                        Layout.fillWidth: true
+                        wrapMode: Text.WordWrap
+                    }
+
+                    Text {
+                        text: qsTr("仓库：git.jokul.space/Jokul/JNetApplet")
+                        font.pixelSize: 11
+                        color: "#999999"
+                        Layout.fillWidth: true
+                        wrapMode: Text.WordWrap
+                    }
+                }
+            }
+        }
+    }
+}

package/networkview.qml

@@ -10,6 +10,7 @@ import Qt.labs.platform as Platform
 import org.deepin.ds 1.0
 import org.deepin.ds.dock 1.0
 import org.deepin.dtk 1.0
+import "components"
 
 AppletItem {
     id: root
@@ -673,158 +674,11 @@ AppletItem {
         }
     }
 
-    // 关于窗口：独立顶层窗口，在桌面中间弹出，展示作者信息
-    // 与设置窗口同样的 frameless + 自定义标题栏模式
-    Window {
+    // 关于窗口：抽取为独立组件 package/components/AboutWindow.qml
+    // 依赖通过属性传入：accentColor = root.accentRed
+    AboutWindow {
         id: aboutWindow
-        width: 320
-        height: 230
-        visible: false
-        flags: Qt.FramelessWindowHint | Qt.Window
-        modality: Qt.NonModal
-        color: "transparent"
-
-        onVisibleChanged: {
-            if (visible) {
-                x = (Screen.width - width) / 2
-                y = (Screen.height - height) / 2
-            }
-        }
-
-        Rectangle {
-            anchors.fill: parent
-            color: "#f5f5f5"
-            radius: 12
-            border.width: 1
-            border.color: "#e0e0e0"
-
-            ColumnLayout {
-                anchors.fill: parent
-                anchors.margins: 0
-                spacing: 0
-
-                // 自定义标题栏（可拖动）
-                Rectangle {
-                    Layout.fillWidth: true
-                    Layout.preferredHeight: 44
-                    color: "transparent"
-
-                    MouseArea {
-                        anchors.fill: parent
-                        drag.target: aboutWindow
-                    }
-
-                    Text {
-                        anchors.left: parent.left
-                        anchors.leftMargin: 16
-                        anchors.verticalCenter: parent.verticalCenter
-                        text: qsTr("关于")
-                        font.pixelSize: 15
-                        font.weight: Font.Bold
-                        color: "#333333"
-                    }
-
-                    Rectangle {
-                        anchors.right: parent.right
-                        anchors.rightMargin: 12
-                        anchors.verticalCenter: parent.verticalCenter
-                        width: 28
-                        height: 28
-                        radius: 14
-                        color: aboutCloseMouse.containsMouse ? Qt.rgba(220/255, 38/255, 38/255, 0.15) : "transparent"
-
-                        Text {
-                            anchors.centerIn: parent
-                            text: "×"
-                            font.pixelSize: 20
-                            font.weight: Font.Bold
-                            color: aboutCloseMouse.containsMouse ? root.accentRed : "#666666"
-                        }
-
-                        MouseArea {
-                            id: aboutCloseMouse
-                            anchors.fill: parent
-                            hoverEnabled: true
-                            cursorShape: Qt.PointingHandCursor
-                            onClicked: aboutWindow.hide()
-                        }
-                    }
-                }
-
-                // 内容区
-                ColumnLayout {
-                    Layout.fillWidth: true
-                    Layout.fillHeight: true
-                    anchors.margins: 0
-                    spacing: 10
-                    Layout.leftMargin: 24
-                    Layout.rightMargin: 24
-                    Layout.topMargin: 4
-
-                    // 标题组：插件名 + 英文名紧凑排列
-                    ColumnLayout {
-                        spacing: 2
-                        Layout.alignment: Qt.AlignHCenter
-
-                        Text {
-                            text: qsTr("网络速度监控")
-                            font.pixelSize: 18
-                            font.weight: Font.Bold
-                            color: "#333333"
-                            Layout.alignment: Qt.AlignHCenter
-                        }
-
-                        Text {
-                            text: "JNetApplet"
-                            font.pixelSize: 12
-                            color: "#999999"
-                            Layout.alignment: Qt.AlignHCenter
-                        }
-                    }
-
-                    // 分隔线
-                    Rectangle {
-                        Layout.fillWidth: true
-                        Layout.preferredHeight: 1
-                        color: "#e0e0e0"
-                    }
-
-                    // 信息行
-                    ColumnLayout {
-                        spacing: 6
-                        Layout.fillWidth: true
-
-                        Text {
-                            text: qsTr("版本：1.0")
-                            font.pixelSize: 12
-                            color: "#666666"
-                        }
-
-                        Text {
-                            text: qsTr("作者：Jokul")
-                            font.pixelSize: 12
-                            color: "#666666"
-                        }
-
-                        Text {
-                            text: qsTr("描述：监控网络速度和流量")
-                            font.pixelSize: 12
-                            color: "#666666"
-                            Layout.fillWidth: true
-                            wrapMode: Text.WordWrap
-                        }
-
-                        Text {
-                            text: qsTr("仓库：git.jokul.space/Jokul/JNetApplet")
-                            font.pixelSize: 11
-                            color: "#999999"
-                            Layout.fillWidth: true
-                            wrapMode: Text.WordWrap
-                        }
-                    }
-                }
-            }
-        }
+        accentColor: root.accentRed
     }
 
     // 设置窗口：独立顶层窗口，在桌面中间弹出