fix(ui): refine web access and peer list

vnt-web/ui/src/views/PeersView.vue

@@ -19,7 +19,7 @@ let lastTrafficMap = {};
 let lastFetchTime = 0;
 // 展开状态和网速历史
 const expandedPeers = reactive({});
-const speedHistoryMap = {};
+const speedHistoryMap = reactive({});
 const HISTORY_SIZE = 60;
 
 const toggleExpand = (ip) => {
@@ -112,9 +112,9 @@ const getRouteModeClass = (route) => {
   // 判断是否直连:metric === 1
   const isDirect = route.metric === 1;
   if (isDirect) {
-    return "text-purple-600 font-medium dark:text-purple-400"; // 直连 - 紫色
+    return "font-medium text-green-600 dark:text-green-400";
   } else {
-    return "text-blue-600 dark:text-blue-400"; // 客户端中继 - 蓝色
+    return "text-blue-600 dark:text-blue-400";
   }
 };
 
@@ -183,7 +183,7 @@ const switcherClass = (fileName) =>
         </div>
       </div>
       <div class="custom-scrollbar max-h-[600px] overflow-x-auto">
-        <table class="table">
+        <table class="table peer-table">
           <thead>
             <tr>
               <th class="w-8 px-2"></th>
@@ -226,7 +226,7 @@ const switcherClass = (fileName) =>
                 <td>
                   <div class="flex items-center gap-2">
                     <span :class="peer.online ? 'badge-green' : 'badge-gray'">{{
-                      peer.online ? "Online" : "Offline"
+                      peer.online ? "在线" : "离线"
                     }}</span>
                     <!-- 加密状态图标 -->
                     <div v-if="peer.online && peer.key_equal === 1" class="tooltip">
@@ -316,3 +316,21 @@ const switcherClass = (fileName) =>
     </div>
   </div>
 </template>
+
+<style scoped>
+.peer-table :deep(thead th) {
+  padding: 0.5rem;
+  font-size: 0.6875rem;
+}
+
+.peer-table :deep(tbody td) {
+  padding: 0.5rem;
+  font-size: 0.75rem;
+}
+
+.peer-table :deep(th:first-child),
+.peer-table :deep(td:first-child) {
+  padding-left: 0.25rem;
+  padding-right: 0;
+}
+</style>

vnt-web/ui/src/views/WebAccessView.vue

@@ -87,11 +87,6 @@ const updateListenScope = async (value) => {
   await saveNetworkSettings();
 };
 
-const copyToken = async () => {
-  await navigator.clipboard.writeText(draft.token);
-  notice.value = "访问令牌已复制";
-};
-
 const copyUrl = async () => {
   await navigator.clipboard.writeText(status.value.url);
   notice.value = "访问地址已复制";
@@ -120,7 +115,6 @@ onMounted(load);
         <div class="flex items-start justify-between gap-5">
           <div>
             <h3 class="text-sm font-semibold text-slate-900 dark:text-white">启用 Web 服务</h3>
-            <p class="mt-1 text-xs leading-5 text-slate-400">服务内置于桌面客户端，不会启动单独的 vnt2_web 进程。</p>
           </div>
           <button
             type="button"
@@ -159,10 +153,7 @@ onMounted(load);
             <span class="text-sm font-medium text-slate-700 dark:text-slate-200">访问令牌</span>
             <button class="text-xs font-medium text-indigo-600 hover:text-indigo-500 disabled:opacity-50 dark:text-indigo-400" type="button" :disabled="saving" @click="regenerate">更换令牌</button>
           </div>
-          <div class="flex items-center gap-2">
-            <code class="min-w-0 flex-1 truncate rounded-lg border border-slate-200 bg-slate-50 px-3 py-2.5 text-xs text-slate-600 dark:border-slate-700 dark:bg-slate-950 dark:text-slate-300">{{ draft.token }}</code>
-            <button class="btn-ghost shrink-0" type="button" :disabled="saving" @click="copyToken">复制令牌</button>
-          </div>
+          <code class="block min-w-0 truncate rounded-lg border border-slate-200 bg-slate-50 px-3 py-2.5 text-xs text-slate-600 dark:border-slate-700 dark:bg-slate-950 dark:text-slate-300">{{ draft.token }}</code>
           <p class="mt-2 text-xs text-slate-400">更换令牌后，已登录的浏览器需要使用新令牌重新鉴权。</p>
         </div>