完善订阅

package-lock.json

@@ -8,6 +8,7 @@
       "name": "bettergi-scripts-web",
       "version": "0.0.0",
       "dependencies": {
+        "@vueuse/core": "^11.1.0",
         "vue": "^3.4.29"
       },
       "devDependencies": {
@@ -674,6 +675,11 @@
       "integrity": "sha512-AYnb1nQyY49te+VRAVgmzfcgjYS91mY5P0TKUDCLEM+gNnA+3T6rWITXRLYCpahpqSQbN5cE+gHpnPyXjHWxcw==",
       "dev": true
     },
+    "node_modules/@types/web-bluetooth": {
+      "version": "0.0.20",
+      "resolved": "https://registry.npmmirror.com/@types/web-bluetooth/-/web-bluetooth-0.0.20.tgz",
+      "integrity": "sha512-g9gZnnXVq7gM7v3tJCWV/qw7w+KeOlSHAhgF9RytFyifW6AF61hdT2ucrYhPq9hLs5JIryeupHV3qGk95dH9ow=="
+    },
     "node_modules/@vitejs/plugin-vue": {
       "version": "5.1.4",
       "resolved": "https://registry.npmmirror.com/@vitejs/plugin-vue/-/plugin-vue-5.1.4.tgz",
@@ -778,6 +784,89 @@
       "resolved": "https://registry.npmmirror.com/@vue/shared/-/shared-3.5.11.tgz",
       "integrity": "sha512-W8GgysJVnFo81FthhzurdRAWP/byq3q2qIw70e0JWblzVhjgOMiC2GyovXrZTFQJnFVryYaKGP3Tc9vYzYm6PQ=="
     },
+    "node_modules/@vueuse/core": {
+      "version": "11.1.0",
+      "resolved": "https://registry.npmmirror.com/@vueuse/core/-/core-11.1.0.tgz",
+      "integrity": "sha512-P6dk79QYA6sKQnghrUz/1tHi0n9mrb/iO1WTMk/ElLmTyNqgDeSZ3wcDf6fRBGzRJbeG1dxzEOvLENMjr+E3fg==",
+      "dependencies": {
+        "@types/web-bluetooth": "^0.0.20",
+        "@vueuse/metadata": "11.1.0",
+        "@vueuse/shared": "11.1.0",
+        "vue-demi": ">=0.14.10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/@vueuse/core/node_modules/vue-demi": {
+      "version": "0.14.10",
+      "resolved": "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.14.10.tgz",
+      "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
+      "hasInstallScript": true,
+      "bin": {
+        "vue-demi-fix": "bin/vue-demi-fix.js",
+        "vue-demi-switch": "bin/vue-demi-switch.js"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "@vue/composition-api": "^1.0.0-rc.1",
+        "vue": "^3.0.0-0 || ^2.6.0"
+      },
+      "peerDependenciesMeta": {
+        "@vue/composition-api": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@vueuse/metadata": {
+      "version": "11.1.0",
+      "resolved": "https://registry.npmmirror.com/@vueuse/metadata/-/metadata-11.1.0.tgz",
+      "integrity": "sha512-l9Q502TBTaPYGanl1G+hPgd3QX5s4CGnpXriVBR5fEZ/goI6fvDaVmIl3Td8oKFurOxTmbXvBPSsgrd6eu6HYg==",
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/@vueuse/shared": {
+      "version": "11.1.0",
+      "resolved": "https://registry.npmmirror.com/@vueuse/shared/-/shared-11.1.0.tgz",
+      "integrity": "sha512-YUtIpY122q7osj+zsNMFAfMTubGz0sn5QzE5gPzAIiCmtt2ha3uQUY1+JPyL4gRCTsLPX82Y9brNbo/aqlA91w==",
+      "dependencies": {
+        "vue-demi": ">=0.14.10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/@vueuse/shared/node_modules/vue-demi": {
+      "version": "0.14.10",
+      "resolved": "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.14.10.tgz",
+      "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
+      "hasInstallScript": true,
+      "bin": {
+        "vue-demi-fix": "bin/vue-demi-fix.js",
+        "vue-demi-switch": "bin/vue-demi-switch.js"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "@vue/composition-api": "^1.0.0-rc.1",
+        "vue": "^3.0.0-0 || ^2.6.0"
+      },
+      "peerDependenciesMeta": {
+        "@vue/composition-api": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/b-tween": {
       "version": "0.3.3",
       "resolved": "https://registry.npmmirror.com/b-tween/-/b-tween-0.3.3.tgz",

package.json

@@ -9,6 +9,7 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@vueuse/core": "^11.1.0",
     "vue": "^3.4.29"
   },
   "devDependencies": {

src/App.vue

@@ -20,7 +20,16 @@
                 <a-tree
                   :data="getCategoryTree(category)"
                   @select="(selectedKeys, event) => handleTreeSelect(selectedKeys, event, category.name)"
-                />
+                >
+                  <template #extra="nodeData">
+                    <a-tooltip content="点击订阅目录">
+                      <IconCopy
+                        style="position: absolute; right: 8px; font-size: 12px; top: 10px; color: #3370ff; cursor: pointer;"
+                        @click.stop="() => onTreeIconClick(nodeData)"
+                      />
+                    </a-tooltip>
+                  </template>
+                </a-tree>
               </a-col>
               <a-col :span="showTree(category) ? 18 : 24">
                 <a-space direction="vertical" size="medium" style="width: 100%;">
@@ -63,7 +72,7 @@
                     </template>
                     <template #operations="{ record }">
                       <a-space>
-                        <a-button type="primary" size="mini" @click="downloadScript(record)">
+                        <a-button v-if="category.name !== 'pathing'" type="primary" size="mini" @click="downloadScript(record)">
                           订阅
                         </a-button>
                         <a-button size="mini" @click="showDetails(record)">
@@ -113,6 +122,7 @@
 <script setup>
 import { ref, onMounted, reactive, computed } from 'vue';
 import { Message, Popover, Typography } from '@arco-design/web-vue';
+import { useClipboard } from '@vueuse/core';
 
 const baseRepo = "https://raw.githubusercontent.com/babalae/bettergi-scripts-list/refs/heads/main/build/tree.json";
 const mirrorUrls = [
@@ -125,12 +135,10 @@ const mirrorUrls = [
   "https://ghproxy.net/{0}"
 ];
 
-const repoOptions = computed(() => {
+const repoOptions = ref(mirrorUrls.map((url, index) => ({
-  return mirrorUrls.map((url, index) => ({
+  label: index === 0 ? "BetterGI 中央仓库" : `BetterGI 中央仓库 镜像 ${index}`,
-    label: index === 0 ? "BetterGI 中央仓库" : `BetterGI 中央仓库 镜像 ${index}`,
+  value: url.replace("{0}", baseRepo)
-    value: url.replace("{0}", baseRepo)
+})));
-  }));
-});
 
 const selectedRepo = ref('');
 const repoData = ref([]);
@@ -161,6 +169,20 @@ const fetchRepoData = async () => {
   
   loading.value = true; // 显示加载模态框
   
+  // 清空现有数据
+  repoData.value = [];
+  Object.keys(searchConditions).forEach(key => {
+    searchConditions[key] = {
+      name: '',
+      author: '',
+      tags: [],
+      path: ''
+    };
+  });
+  Object.keys(filteredData).forEach(key => {
+    filteredData[key] = [];
+  });
+  
   try {
     const response = await fetch(selectedRepo.value);
     const data = await response.json();
@@ -295,16 +317,22 @@ const getTagColor = (tag) => {
   return tagColorMap[tag];
 };
 
-onMounted(() => {
+const { copy } = useClipboard();
-  // 默认选中第一个仓库
-  selectedRepo.value = repoOptions.value[0].value;
-  fetchRepoData();
-});
 
 const downloadScript = (script) => {
-  // 实现下载逻辑
+  // 创建一个包含脚本路径的数组
-  console.log('Downloading script:', script.name);
+  const subscriptionData = [script.path];
-  Message.success(`正在下载 ${script.name}`);
+
+  // 将数组转换为 JSON 字符串
+  const jsonString = JSON.stringify(subscriptionData);
+
+  // 将 JSON 字符串复制到剪贴板
+  copy(jsonString).then(() => {
+    Message.success(`已将 ${script.name} 的订阅信息复制到剪贴板`);
+  }).catch((error) => {
+    console.error('复制到剪贴板失败:', error);
+    Message.error(`复制 ${script.name} 的订阅信息失败`);
+  });
 };
 
 const showDetails = (script) => {
@@ -324,22 +352,22 @@ const closeDrawer = () => {
 };
 
 const getCategoryTree = (category) => {
-  const buildTree = (node) => {
+  const buildTree = (node, isRoot = false) => {
     if (node.type === 'file') {
       return null;
     }
     return {
-      title: node.name,
+      title: isRoot ? getCategoryDisplayName(node.name) : node.name,
       key: node.path,
       children: Array.isArray(node.children)
         ? node.children
-            .map(buildTree)
+            .map(child => buildTree(child, false))
             .filter(Boolean)
         : undefined,
       selectable: true
     };
   };
-  return [buildTree(category)].filter(Boolean);
+  return [buildTree(category, true)].filter(Boolean);
 };
 
 const showTree = (category) => {
@@ -369,6 +397,18 @@ const categoryNameMap = {
 const getCategoryDisplayName = (name) => {
   return categoryNameMap[name] || name;
 };
+
+const onTreeIconClick = (nodeData) => {
+  downloadScript({name: nodeData.title, path: nodeData.key});
+};
+
+onMounted(() => {
+  // 默认选中第一个仓库
+  if (repoOptions.value.length > 0) {
+    selectedRepo.value = repoOptions.value[0].value;
+    fetchRepoData();
+  }
+});
 </script>
 
 <style scoped>