From 7fe152e3aa6861225d0bd99b4d77ad640fbc0bc1 Mon Sep 17 00:00:00 2001
From: fatedier <fatedier@gmail.com>
Date: Tue, 30 Jun 2026 01:33:57 +0800
Subject: [PATCH] web/frps: use API v2 for client and proxy details (#5386)

---
 web/frps/src/api/proxy.ts          | 11 +++++++++--
 web/frps/src/types/proxy.ts        |  3 ++-
 web/frps/src/views/ProxyDetail.vue |  6 +++---
 3 files changed, 14 insertions(+), 6 deletions(-)

diff --git a/web/frps/src/api/proxy.ts b/web/frps/src/api/proxy.ts
index 20125842..7e104136 100644
--- a/web/frps/src/api/proxy.ts
+++ b/web/frps/src/api/proxy.ts
@@ -32,7 +32,7 @@ export const getProxiesV2 = async (params: ProxyListV2Params = {}) => {
   }
 }
 
-const toLegacyProxyStats = (proxy: ProxyV2Info): ProxyStatsInfo => ({
+export const toLegacyProxyStats = (proxy: ProxyV2Info): ProxyStatsInfo => ({
   name: proxy.name,
   type: proxy.type,
   conf: proxy.spec,
@@ -43,13 +43,20 @@ const toLegacyProxyStats = (proxy: ProxyV2Info): ProxyStatsInfo => ({
   curConns: proxy.status.curConns,
   lastStartTime: proxy.status.lastStartTime,
   lastCloseTime: proxy.status.lastCloseTime,
-  status: proxy.status.phase,
+  status: proxy.status.state || proxy.status.phase || '',
 })
 
 export const getProxy = (type: string, name: string) => {
   return http.get<ProxyStatsInfo>(`../api/proxy/${type}/${name}`)
 }
 
+export const getProxyByNameV2 = async (name: string) => {
+  const proxy = await http.getV2<ProxyV2Info>(
+    `../api/v2/proxies/${encodeURIComponent(name)}`,
+  )
+  return toLegacyProxyStats(proxy)
+}
+
 export const getProxyByName = (name: string) => {
   return http.get<ProxyStatsInfo>(`../api/proxies/${name}`)
 }
diff --git a/web/frps/src/types/proxy.ts b/web/frps/src/types/proxy.ts
index 53645d48..d509907f 100644
--- a/web/frps/src/types/proxy.ts
+++ b/web/frps/src/types/proxy.ts
@@ -36,7 +36,8 @@ export interface ProxyV2Info {
 }
 
 export interface ProxyV2Status {
-  phase: string
+  state?: string
+  phase?: string
   todayTrafficIn: number
   todayTrafficOut: number
   curConns: number
diff --git a/web/frps/src/views/ProxyDetail.vue b/web/frps/src/views/ProxyDetail.vue
index a6720424..07359aae 100644
--- a/web/frps/src/views/ProxyDetail.vue
+++ b/web/frps/src/views/ProxyDetail.vue
@@ -241,7 +241,7 @@ import {
   Tickets,
   Location,
 } from '@element-plus/icons-vue'
-import { getProxyByName } from '../api/proxy'
+import { getProxyByNameV2 } from '../api/proxy'
 import { getServerInfo } from '../api/server'
 import {
   BaseProxy,
@@ -365,9 +365,9 @@ const fetchProxy = async () => {
   }
 
   try {
-    const data = await getProxyByName(name)
+    const data = await getProxyByNameV2(name)
     const info = await fetchServerInfo()
-    const type = data.conf?.type || ''
+    const type = data.type || data.conf?.type || ''
 
     if (type === 'tcp') {
       proxy.value = new TCPProxy(data)