添加了自动打包流程

.gitea/workflows/auto_build.yaml

@@ -0,0 +1,10 @@
+name: 自动打包
+on: [push]
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - run: npm install
+      - run: npm run build

src/components/Cards/GeneralCard.vue

@@ -5,7 +5,7 @@
     </t-skeleton>
     <template #actions>
       <div class="actions">
-        <t-button size="small" theme="default" @click="$emit('toSubscribeItem', props.url, props.name)">编辑</t-button>
+        <t-button size="small" theme="default" @click="$emit('toSubscribeItem', props.name)">编辑</t-button>
         <t-button size="small" @click="urlVisible = !urlVisible">{{
           urlVisible ? "显示" : "隐藏"
         }}</t-button>
@@ -48,7 +48,6 @@ import { onMounted, ref } from "vue";
 import { DeleteIcon } from "tdesign-icons-vue-next";
 
 const props = defineProps({
-  url: String,
   name: String
 });
 

src/components/General.vue

@@ -1,42 +1,49 @@
 <template>
   <div class="general-content">
-    <div class="control-bar">
+    <t-loading :loading="loading" show-overlay style="min-height: 100vh">
-      <t-button size="large" @click="dialogVisible = true">
+      <div class="control-bar">
-        <!-- icon莫名其妙的小，或许是个bug，也有可能和flex有关 -->
+        <t-button size="large" @click="dialogVisible = true">
-        <!-- <template #icon>
+          <!-- icon莫名其妙的小，或许是个bug，也有可能和flex有关 -->
-          <add-icon />
+          <!-- <template #icon>
-        </template> -->
+            <add-icon />
-         + 添加订阅
+          </template> -->
-      </t-button>
+          + 添加订阅
-      <t-input v-model="searchText" size="large" disabled style="margin: 0 48px 0 16px">
+        </t-button>
-        <template #prefix-icon>
+        <t-input
-          <filter-icon />
+          v-model="searchText"
-        </template>
+          size="large"
-      </t-input>
+          disabled
-    </div>
+          style="margin: 0 48px 0 16px"
-
+        >
-    <div class="card-container">
+          <template #prefix-icon>
-      <div class="card" v-for="i in Url" :key="i">
+            <filter-icon />
-        <GeneralCard
+          </template>
-          :name="i.name"
+        </t-input>
-          @toSubscribeItem="(url, name) => $emit('toSubscribeItem', url, name)"
-        />
       </div>
-    </div>
 
-    <!-- total应当由后端提供,显示条件为卡片数量大于9 -->
+      <div class="card-container">
-    <!-- 暂时禁用 -->
+        <div class="card" v-for="i in Url" :key="i">
-    <t-pagination
+          <GeneralCard
-      v-if="Url.length < 0"
+            :name="i.name"
-      :total="Url.length"
+            @toSubscribeItem="(name) => $emit('toSubscribeItem', name)"
-      showPageNumber
+          />
-      :default-page-size="9"
+        </div>
-      :showPageSize="false"
+      </div>
-      showPreviousAndNextBtn
+
-      :totalContent="false"
+      <!-- total应当由后端提供,显示条件为卡片数量大于9 -->
-      size="small"
+      <!-- 暂时禁用 -->
-      @current-change="onCurrentChange"
+      <t-pagination
-    />
+        v-if="Url.length < 0"
+        :total="Url.length"
+        showPageNumber
+        :default-page-size="9"
+        :showPageSize="false"
+        showPreviousAndNextBtn
+        :totalContent="false"
+        size="small"
+        @current-change="onCurrentChange"
+      />
+    </t-loading>
   </div>
 
   <!-- dialog -->
@@ -53,7 +60,6 @@
     <t-space direction="vertical" style="width: 100%">
       <div class="dialog-content">
         <t-form :data="fromData" label-align="left">
-
           <t-form-item label="订阅名称" name="name">
             <t-input></t-input>
           </t-form-item>
@@ -61,7 +67,6 @@
           <t-form-item label="别名" name="url">
             <t-input></t-input>
           </t-form-item>
-
         </t-form>
       </div>
     </t-space>
@@ -106,23 +111,27 @@ import { FilterIcon, AddIcon } from "tdesign-icons-vue-next";
 import { computed, onBeforeMount, onMounted, ref } from "vue";
 import GeneralCard from "./Cards/GeneralCard.vue";
 
+import SleepWithSeconds from "../modules/Sleep.js";
+
 const searchText = ref("");
+const loading = ref(true);
 
 //TODO向后端发请求获取代理数据
 const Url = ref([]);
 
-onMounted(() => {
+onMounted(async () => {
   //测试数据（Url长度上限应该为9，按当前分页向服务器请求数据）
-  // for (let i = 0; i < 10; i++) {
+  for (let i = 0; i < 1; i++) {
-  //   Url.value.push({
+    Url.value.push({
-  //     name: "订阅" + i,
+      name: "订阅" + i
-  //     url: "vmess://" + i,
+    });
-  //   });
+    await SleepWithSeconds(1);
-  // }
+  }
-  Url.value.push({
+  loading.value = false;
-    name: "all"
+  // Url.value.push({
-  })
+  //   name: "all"
-  console.log(Url);
+  // });
+  // console.log(Url);
 });
 
 //过滤器
@@ -130,11 +139,11 @@ const filterUrl = computed(() => {
   if (searchText.value.length > 0) {
     return Url.value.filter((item) => {
       return item.name.includes(searchText.value);
-    })
+    });
   } else {
     return Url.value;
   }
-})
+});
 
 const dialogVisible = ref(false);
 const fromData = ref({
@@ -143,8 +152,8 @@ const fromData = ref({
 
 /**
  * 向服务器请求翻页数据
- * @param index Int 页码
+ * @param {number} index 页码
- * @param pageInfo Int 卡片总数
+ * @param {number} pageInfo 卡片总数
  */
 function onCurrentChange(index, pageInfo) {
   console.log(index, pageInfo);

src/components/Main.vue

@@ -34,20 +34,17 @@
     </t-aside>
     <t-layout>
       <t-content style="overflow: auto">
-        <t-loading :loading="false" show-overlay style="height: 100vh;">
+        <div>
-          <div>
+          <General
-            <General
+            @toSubscribeItem="(name) => toSubscribeItem(name)"
-              @toSubscribeItem="(url, name) => toSubscribeItem(url, name)"
+            v-if="menuValue === 'General'"
-              v-if="menuValue === 'General'"
+          />
-            />
+          <SubscribeItem
-            <SubscribeItem
+            @backToGeneral="menuValue = 'General'"
-              @backToGeneral="menuValue = 'General'"
+            :name="Name"
-              :propsData="Url"
+            v-if="menuValue === 'SubscribeItem'"
-              :name="Name"
+          />
-              v-if="menuValue === 'SubscribeItem'"
+        </div>
-            />
-          </div>
-        </t-loading>
       </t-content>
     </t-layout>
   </t-layout>
@@ -59,7 +56,7 @@
   width: 100vw;
 }
 
-.t-layout__sider{
+.t-layout__sider {
   width: auto !important;
 }
 </style>
@@ -72,7 +69,6 @@ import { ViewListIcon, AppIcon } from "tdesign-icons-vue-next";
 
 const menuValue = ref("General");
 const collapsed = ref(false);
-let Url = "";
 let Name = "";
 
 function changeHandler(active) {
@@ -80,9 +76,8 @@ function changeHandler(active) {
   menuValue.value = active;
 }
 
-function toSubscribeItem(url, name) {
+function toSubscribeItem(name) {
   // console.log(url);
-  Url = url;
   Name = name;
   menuValue.value = "SubscribeItem";
 }

src/components/SubscribeItem.vue

@@ -77,7 +77,7 @@ import { AddIcon, PasteIcon } from "tdesign-icons-vue-next";
 import { MessagePlugin } from "tdesign-vue-next";
 
 const props = defineProps({
-  name: String,
+  name: String
 });
 
 let data = ref([]);
@@ -156,7 +156,7 @@ const columns = ref([
 
 /**
  * 复制文本到剪贴板
- * @param text 复制的文本
+ * @param {String} text 复制的文本
  */
 function copyToClipboard(text) {
   try {
@@ -204,8 +204,8 @@ function addNode() {
 
 /**
  * 编辑节点
- * @param arg string 协议类型 
+ * @param {String} arg 协议类型 
- * @param url string base64编码
+ * @param {String} url base64编码
  */
 function editNode(arg, url) {
   // 测试

src/modules/Sleep.js

@@ -0,0 +1,19 @@
+/**
+ * 延迟s秒后继续，需要提供await关键字
+ * @param {number} s 秒
+ * @return {Promise}
+ */
+export function SleepWithSeconds(s) {
+  return new Promise(resolve => setTimeout(resolve, s * 1000));
+}
+
+/**
+ * 延迟ms毫秒后继续，需要提供await关键字
+ * @param {number} ms 毫秒
+ * @return {Promise}
+ */
+export function SleepWithMilliseconds(ms) {
+  return new Promise(resolve => setTimeout(resolve, ms));
+}
+
+export default SleepWithSeconds;