From bed91b658da84a3242379fe96e85e7d57ad0b806 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=8E=8B=E8=89=AF?= <841369634@qq.com>
Date: Sun, 1 Dec 2024 03:47:26 +0800
Subject: [PATCH] =?UTF-8?q?=E5=B8=AE=E5=8A=A9=E4=B8=AD=E5=BF=83=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=EF=BC=8C=E5=AE=8C=E6=88=90=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/core/src/config/index.js             | 11 ++++++++
 .../gui/src/view/components/tree-node.vue     | 25 ++++++++++++++++++
 packages/gui/src/view/pages/help.vue          | 23 +++++-----------
 packages/gui/src/view/router/menu.js          |  2 +-
 packages/gui/src/view/style/index.scss        | 26 +++++++++++++++++++
 5 files changed, 70 insertions(+), 17 deletions(-)
 create mode 100644 packages/gui/src/view/components/tree-node.vue

diff --git a/packages/core/src/config/index.js b/packages/core/src/config/index.js
index 8417d3a..5020f34 100644
--- a/packages/core/src/config/index.js
+++ b/packages/core/src/config/index.js
@@ -419,4 +419,15 @@ module.exports = {
   },
   proxy: {},
   plugin: {},
+  help: {
+    data: [
+      {
+        title: '查看DevSidecar的说明文档（Wiki）',
+        url: 'https://github.com/docmirror/dev-sidecar/wiki',
+      },
+      {
+        title: '为了展示更多帮助信息，请启用 “远程配置” 功能！！！',
+      },
+    ],
+  },
 }
diff --git a/packages/gui/src/view/components/tree-node.vue b/packages/gui/src/view/components/tree-node.vue
new file mode 100644
index 0000000..3e50a40
--- /dev/null
+++ b/packages/gui/src/view/components/tree-node.vue
@@ -0,0 +1,25 @@
+<script>
+export default {
+  name: 'TreeNode',
+  props: {
+    treeData: Array,
+  },
+  methods: {
+    async openExternal (url) {
+      await this.$api.ipc.openExternal(url)
+    },
+  },
+}
+</script>
+
+<template>
+  <ul>
+    <li v-for="node in treeData" :key="node.title">
+      <span v-if="node.url && (node.url.startsWith('http://') || node.url.startsWith('https://'))" :title="node.title">
+        <a @click="openExternal(node.url)">{{ node.title }}</a>
+      </span>
+      <span v-else :title="node.title">{{ node.title }}</span>
+      <tree-node v-if="node.children && node.children.length > 0" :tree-data="node.children" class="child-node" />
+    </li>
+  </ul>
+</template>
diff --git a/packages/gui/src/view/pages/help.vue b/packages/gui/src/view/pages/help.vue
index 8554c08..295c3b7 100644
--- a/packages/gui/src/view/pages/help.vue
+++ b/packages/gui/src/view/pages/help.vue
@@ -1,8 +1,12 @@
 <script>
 import Plugin from '../mixins/plugin'
+import TreeNode from '../components/tree-node'
 
 export default {
   name: 'Help',
+  components: {
+    TreeNode,
+  },
   mixins: [Plugin],
   data () {
     return {
@@ -10,19 +14,6 @@ export default {
     }
   },
   methods: {
-    ready (config) {
-    },
-    async openLog () {
-      const dir = await this.$api.info.getConfigDir()
-      this.$api.ipc.openPath(`${dir}/logs/`)
-    },
-    async applyBefore () {
-      if (!this.config.app.showHideShortcut) {
-        this.config.app.showHideShortcut = '无'
-      }
-    },
-    async applyAfter () {
-    },
     async openExternal (url) {
       await this.$api.ipc.openExternal(url)
     },
@@ -35,12 +26,12 @@ export default {
     <template slot="header">
       帮助中心
       <span>
-        <a-button type="primary" @click="openExternal('https://github.com/docmirror/dev-sidecar/issues/new/choose')">反馈问题</a-button>
+        <a-button @click="openExternal('https://github.com/docmirror/dev-sidecar/issues/new/choose')">反馈问题</a-button>
       </span>
     </template>
 
-    <div v-if="config">
-      啊啊啊
+    <div v-if="config" class="help-list">
+      <TreeNode :tree-data="config.help.dataList" />
     </div>
   </ds-container>
 </template>
diff --git a/packages/gui/src/view/router/menu.js b/packages/gui/src/view/router/menu.js
index 6a0cb58..5b06b4b 100644
--- a/packages/gui/src/view/router/menu.js
+++ b/packages/gui/src/view/router/menu.js
@@ -15,7 +15,7 @@ export default function createMenus (app) {
       icon: 'api',
       children: plugins,
     },
-    { title: '帮助中心', path: '/help', icon: 'help' },
+    { title: '帮助中心', path: '/help', icon: 'star' },
   ]
   if (app.$global && app.$global.setting && app.$global.setting.overwall) {
     plugins.push({ title: '功能增强', path: '/plugin/overwall', icon: 'global' })
diff --git a/packages/gui/src/view/style/index.scss b/packages/gui/src/view/style/index.scss
index cae2839..6c50d5b 100644
--- a/packages/gui/src/view/style/index.scss
+++ b/packages/gui/src/view/style/index.scss
@@ -138,3 +138,29 @@ hr {
     margin: 0 5px 5px 5px;
   }
 }
+
+.help-list {
+  ul {
+    padding-left: 10px;
+    li {
+      list-style: none;
+      line-height: 35px;
+
+      span {
+        display: block;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+
+      a:hover {
+        text-decoration: underline;
+      }
+    }
+
+    // 嵌套列表
+    ul {
+      padding-left: 20px;
+    }
+  }
+}
\ No newline at end of file