feat: M3 load balancing + health check (model/render/admin API status/UI)

web/src/views/StatusView.vue

@@ -42,6 +42,25 @@
                 {{ f.service }} → :{{ f.remotePort }}
               </span>
             </div>
+            <div v-if="p.groupCount" class="ns-groups">
+              <span class="ns-group-badge">LB ×{{ p.groupCount }}</span>
+            </div>
+            <div v-if="p.proxyStates?.length" class="ns-proxies">
+              <div
+                v-for="ps in p.proxyStates"
+                :key="ps.name"
+                class="ns-proxy"
+                :class="proxyStateClass(ps.status)"
+              >
+                <span class="np-name">{{ ps.name }}</span>
+                <span class="np-status">{{ proxyStateLabel(ps.status) }}</span>
+                <span v-if="ps.remote_addr" class="np-addr">{{ ps.remote_addr }}</span>
+                <span v-if="ps.err" class="np-err" :title="ps.err">{{ ps.err }}</span>
+              </div>
+            </div>
+            <div v-else-if="p.adminEnabled" class="ns-proxies-empty">
+              管理 API 未返回状态（frpc 未连上远程 frps 或无代理）
+            </div>
           </div>
           <div v-if="!status.profiles.length" class="ns-empty">尚未配置远程节点</div>
         </div>
@@ -239,6 +258,38 @@ const connBadgeClass = (s?: string) => {
 
 const workerHealthy = (s?: string) => s === 'running'
 
+// M3: per-proxy state from frpc admin API.
+const proxyStateLabel = (s?: string) => {
+  switch (s) {
+    case 'running':
+      return '运行中'
+    case 'wait start':
+      return '等待启动'
+    case 'start error':
+      return '启动错误'
+    case 'check failed':
+      return '健康检查失败'
+    case 'closed':
+      return '已关闭'
+    case 'new':
+    default:
+      return '新建'
+  }
+}
+const proxyStateClass = (s?: string) => {
+  switch (s) {
+    case 'running':
+      return 'ok'
+    case 'check failed':
+    case 'start error':
+      return 'err'
+    case 'wait start':
+      return 'pending'
+    default:
+      return ''
+  }
+}
+
 // localWorkerLabel: state of the LOCAL frpc worker driving this target
 // (we do not control the remote frps).
 const localWorkerLabel = (s?: string) => {
@@ -470,14 +521,81 @@ onBeforeUnmount(() => {
   margin-top: 6px;
 }
 
-.ns-fwd {
+.ns-groups {
+  display: flex;
+  gap: 4px;
+  margin-top: 6px;
+}
+
+.ns-group-badge {
+  font-size: 11px;
+  background: rgba(64, 158, 255, 0.12);
+  color: #409eff;
+  border-radius: 10px;
+  padding: 1px 8px;
+}
+
+.ns-proxies {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  margin-top: 6px;
+}
+
+.ns-proxy {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 12px;
+  border: 1px solid $color-border-lighter;
+  border-radius: 8px;
+  padding: 3px 8px;
+  background: #fff;
+
+  &.ok {
+    border-left: 3px solid $color-success;
+  }
+
+  &.pending {
+    border-left: 3px solid #409eff;
+  }
+
+  &.err {
+    border-left: 3px solid $color-danger;
+  }
+}
+
+.np-name {
+  font-weight: 600;
+}
+
+.np-status {
   font-size: 11px;
-  background: $color-bg-muted;
-  border-radius: 6px;
-  padding: 1px 6px;
   color: $color-text-secondary;
 }
 
+.np-addr {
+  margin-left: auto;
+  font-size: 11px;
+  color: $color-text-muted;
+}
+
+.np-err {
+  margin-left: auto;
+  font-size: 11px;
+  color: $color-danger;
+  max-width: 180px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.ns-proxies-empty {
+  margin-top: 6px;
+  font-size: 12px;
+  color: $color-text-muted;
+}
+
 .ns-empty,
 .ls-empty {
   color: $color-text-muted;