From 3e5cd71bf58fd11b0ceb9f7cfb2f9c1922728850 Mon Sep 17 00:00:00 2001
From: lwch <lwch748@gmail.com>
Date: Wed, 13 Oct 2021 18:28:11 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E9=9A=A7=E9=81=93=E5=88=97?=
 =?UTF-8?q?=E8=A1=A8=EF=BC=8C=E5=A2=9E=E5=8A=A0=E8=BF=9C=E7=AB=AF=E5=90=8D?=
 =?UTF-8?q?=E7=A7=B0=E5=AD=97=E6=AE=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 code/client/dashboard/h_tunnels.go   | 10 ++++++----
 code/client/tunnel/mgr.go            |  1 +
 code/client/tunnel/reverse/tunnel.go |  5 +++++
 code/client/tunnel/shell/shell.go    |  5 +++++
 html/dashboard/index.html            |  3 ++-
 html/dashboard/js/index.js           |  7 +++++++
 6 files changed, 26 insertions(+), 5 deletions(-)

diff --git a/code/client/dashboard/h_tunnels.go b/code/client/dashboard/h_tunnels.go
index dcfdb57..1a70482 100644
--- a/code/client/dashboard/h_tunnels.go
+++ b/code/client/dashboard/h_tunnels.go
@@ -15,15 +15,17 @@ func (db *Dashboard) Tunnels(w http.ResponseWriter, r *http.Request) {
 		RecvPacket uint64 `json:"recv_packet"`
 	}
 	type item struct {
-		Name  string `json:"name"`
-		Port  uint16 `json:"port"`
-		Type  string `json:"type"`
-		Links []link `json:"links"`
+		Name   string `json:"name"`
+		Remote string `json:"remote"`
+		Port   uint16 `json:"port"`
+		Type   string `json:"type"`
+		Links  []link `json:"links"`
 	}
 	var ret []item
 	db.mgr.Range(func(t tunnel.Tunnel) {
 		var it item
 		it.Name = t.GetName()
+		it.Remote = t.GetRemote()
 		it.Port = t.GetPort()
 		it.Type = t.GetTypeName()
 		for _, l := range t.GetLinks() {
diff --git a/code/client/tunnel/mgr.go b/code/client/tunnel/mgr.go
index 786873a..c460058 100644
--- a/code/client/tunnel/mgr.go
+++ b/code/client/tunnel/mgr.go
@@ -13,6 +13,7 @@ type Link interface {
 // Tunnel tunnel interface
 type Tunnel interface {
 	GetName() string
+	GetRemote() string
 	GetPort() uint16
 	GetTypeName() string
 	GetTarget() string
diff --git a/code/client/tunnel/reverse/tunnel.go b/code/client/tunnel/reverse/tunnel.go
index 1bf295c..9409526 100644
--- a/code/client/tunnel/reverse/tunnel.go
+++ b/code/client/tunnel/reverse/tunnel.go
@@ -54,6 +54,11 @@ func (t *Tunnel) GetLinks() []tunnel.Link {
 	return ret
 }
 
+// GetRemote get remote target name
+func (t *Tunnel) GetRemote() string {
+	return t.cfg.Target
+}
+
 // GetPort get listen port
 func (t *Tunnel) GetPort() uint16 {
 	return t.cfg.LocalPort
diff --git a/code/client/tunnel/shell/shell.go b/code/client/tunnel/shell/shell.go
index 1e15a01..b4ca1e0 100644
--- a/code/client/tunnel/shell/shell.go
+++ b/code/client/tunnel/shell/shell.go
@@ -55,6 +55,11 @@ func (shell *Shell) GetLinks() []tunnel.Link {
 	return ret
 }
 
+// GetRemote get remote target name
+func (shell *Shell) GetRemote() string {
+	return shell.cfg.Target
+}
+
 // GetPort get listen port
 func (shell *Shell) GetPort() uint16 {
 	return shell.cfg.LocalPort
diff --git a/html/dashboard/index.html b/html/dashboard/index.html
index 0b4ab99..14da4d3 100644
--- a/html/dashboard/index.html
+++ b/html/dashboard/index.html
@@ -30,7 +30,8 @@
                         <table id="tunnels" class="table table-hover">
                             <thead><tr>
                                 <th>名称</th>
-                                <th style="width:80px">类型</th>
+                                <th style="width:200px">对端</th>
+                                <th style="width:120px">类型</th>
                                 <th style="width:120px">虚拟连接数</th>
                                 <th style="width:200px">接收/发送（字节数）</th>
                                 <th style="width:200px">接收/发送（数据包）</th>
diff --git a/html/dashboard/js/index.js b/html/dashboard/js/index.js
index 1aa530c..1e9f126 100644
--- a/html/dashboard/js/index.js
+++ b/html/dashboard/js/index.js
@@ -1,10 +1,15 @@
 var page = {
     init: function() {
+        page.render();
+        setInterval(page.render, 5000);
+    },
+    render: function() {
         page.render_cards();
         page.render_tunnels();
     },
     render_cards: function() {
         $.get('/api/info', function(ret) {
+            $('#cards').empty();
             page.add_card('隧道总数', ret.tunnels);
             page.add_card('物理连接数', ret.physical_links);
             page.add_card('虚拟连接数', ret.virtual_links);
@@ -13,6 +18,7 @@ var page = {
     },
     render_tunnels: function() {
         $.get('/api/tunnels', function(ret) {
+            $('#tunnels tbody').empty();
             $.each(ret, function(_, tunnel) {
                 var send_bytes = 0;
                 var send_packet = 0;
@@ -33,6 +39,7 @@ var page = {
                 var str = `
                 <tr>
                     <td>${tunnel.name}</td>
+                    <td>${tunnel.remote}</td>
                     <td>${tunnel.type}</td>
                     <td>${tunnel.links?tunnel.links.length:0}</td>
                     <td>${humanize.bytes(recv_bytes)}/${humanize.bytes(send_bytes)}</td>