集群界面数据改成异步加载

internal/web/actions/default/clusters/cluster/boards/index.go

@@ -10,7 +10,6 @@ import (
 	"github.com/iwind/TeaGo/maps"
 	"github.com/iwind/TeaGo/types"
 	timeutil "github.com/iwind/TeaGo/utils/time"
-	"strconv"
 )
 
 type IndexAction struct {
@@ -23,10 +22,17 @@ func (this *IndexAction) Init() {
 
 func (this *IndexAction) RunGet(params struct {
 	ClusterId int64
+}) {
+	this.Data["clusterId"] = params.ClusterId
+
+	this.Show()
+}
+
+func (this *IndexAction) RunPost(params struct {
+	ClusterId int64
 }) {
 	if !teaconst.IsPlus {
-		this.RedirectURL("/clusters/cluster?clusterId=" + strconv.FormatInt(params.ClusterId, 10))
+		this.Fail("only for commercial users")
-		return
 	}
 
 	resp, err := this.RPC().ServerStatBoardRPC().ComposeServerStatNodeClusterBoard(this.AdminContext(), &pb.ComposeServerStatNodeClusterBoardRequest{NodeClusterId: params.ClusterId})
@@ -178,5 +184,5 @@ func (this *IndexAction) RunGet(params struct {
 		this.Data["metricCharts"] = chartMaps
 	}
 
-	this.Show()
+	this.Success()
 }

internal/web/actions/default/clusters/cluster/init.go

@@ -59,7 +59,7 @@ func init() {
 
 			// 看板相关
 			Prefix("/clusters/cluster/boards").
-			Get("", new(boards.IndexAction)).
+			GetPost("", new(boards.IndexAction)).
 			EndAll()
 	})
 }

internal/web/actions/default/ns/domains/index.go

@@ -12,7 +12,7 @@ type IndexAction struct {
 }
 
 func (this *IndexAction) Init() {
-	this.FirstMenu("domain")
+	this.Nav("", "", "index")
 }
 
 func (this *IndexAction) RunGet(params struct {

web/views/@default/clusters/cluster/boards/index.css

@@ -1,3 +1,6 @@
+.message.loading {
+  padding: 1.5em;
+}
 .grid {
   margin-top: 2em !important;
   margin-left: 2em !important;

web/views/@default/clusters/cluster/boards/index.css.map

@@ -1 +1 @@
-{"version":3,"sources":["index.less"],"names":[],"mappings":"AAAA;EACC,0BAAA;EACA,2BAAA;;AAFD,KAIC;EACC,kBAAA;EACA,4BAAA;;AANF,KAIC,QAIC,IAAG;EACF,iBAAA;;AATH,KAIC,QAIC,IAAG,MAGF;EACC,cAAA;EACA,mBAAA;;AAbJ,KAkBC,QAAO;EACN,eAAA;;AAnBF,KAsBC,GACC;EACC,aAAA;;AAxBH,KA4BC,QAAO,MACN;EACC,eAAA;;AAKH;EACC,YAAA;;AAGD,EACC;EACC,gBAAA;EACA,WAAA","file":"index.css"}
+{"version":3,"sources":["index.less"],"names":[],"mappings":"AAAA,QAAQ;EACP,cAAA;;AAGD;EACC,0BAAA;EACA,2BAAA;;AAFD,KAIC;EACC,kBAAA;EACA,4BAAA;;AANF,KAIC,QAIC,IAAG;EACF,iBAAA;;AATH,KAIC,QAIC,IAAG,MAGF;EACC,cAAA;EACA,mBAAA;;AAbJ,KAkBC,QAAO;EACN,eAAA;;AAnBF,KAsBC,GACC;EACC,aAAA;;AAxBH,KA4BC,QAAO,MACN;EACC,eAAA;;AAKH;EACC,YAAA;;AAGD,EACC;EACC,gBAAA;EACA,WAAA","file":"index.css"}

web/views/@default/clusters/cluster/boards/index.html

@@ -1,6 +1,13 @@
 {$layout}
 {$template "/echarts"}
 
+<!-- 加载中 -->
+<div>
+    <div class="ui message loading" v-if="isLoading">
+        <div class="ui active inline loader small"></div>  &nbsp; 数据加载中...
+    </div>
+</div>
+
 <div class="ui four columns grid">
     <div class="ui column">
         <h4>在线节点<link-icon :href="'/clusters/cluster/nodes?clusterId=' + clusterId"></link-icon></h4>

web/views/@default/clusters/cluster/boards/index.js

@@ -1,15 +1,33 @@
 Tea.context(function () {
+	this.isLoading = true
+	this.board = {}
+	this.metricCharts = []
+
+
 	/**
 	 * 流量统计
 	 */
 	this.trafficTab = "hourly"
 
 	this.$delay(function () {
-		this.reloadHourlyTrafficChart()
+		this.$post("$")
-		this.reloadHourlyRequestsChart()
+			.params({
-		this.reloadTopNodesChart()
+				clusterId: this.clusterId
-		this.reloadTopDomainsChart()
+			})
-		this.reloadCPUChart()
+			.timeout(30)
+			.success(function (resp) {
+				for (let k in resp.data) {
+					this[k] = resp.data[k]
+				}
+
+				this.reloadHourlyTrafficChart()
+				this.reloadHourlyRequestsChart()
+				this.reloadTopNodesChart()
+				this.reloadTopDomainsChart()
+				this.reloadCPUChart()
+
+				this.isLoading = false
+			})
 	})
 
 	this.selectTrafficTab = function (tab) {

web/views/@default/clusters/cluster/boards/index.less

@@ -1,3 +1,7 @@
+.message.loading {
+	padding: 1.5em;
+}
+
 .grid {
 	margin-top: 2em !important;
 	margin-left: 2em !important;

web/views/@default/clusters/cluster/node/boards/index.css

@@ -1,3 +1,6 @@
+.message.loading {
+  padding: 1.5em;
+}
 .grid {
   margin-top: 2em !important;
   margin-left: 2em !important;

web/views/@default/clusters/cluster/node/boards/index.css.map

@@ -1 +1 @@
-{"version":3,"sources":["index.less"],"names":[],"mappings":"AAAA;EACC,0BAAA;EACA,2BAAA;;AAFD,KAIC;EACC,kBAAA;EACA,4BAAA;;AANF,KAIC,QAIC,IAAG;EACF,iBAAA;;AATH,KAIC,QAIC,IAAG,MAGF;EACC,cAAA;EACA,mBAAA;;AAbJ,KAkBC,QAAO;EACN,eAAA;;AAnBF,KAsBC,GACC;EACC,aAAA;;AAxBH,KA4BC,QAAO,MACN;EACC,eAAA;;AAKH;EACC,YAAA;;AAGD,EACC;EACC,gBAAA;EACA,WAAA","file":"index.css"}
+{"version":3,"sources":["index.less"],"names":[],"mappings":"AAAA,QAAQ;EACP,cAAA;;AAGD;EACC,0BAAA;EACA,2BAAA;;AAFD,KAIC;EACC,kBAAA;EACA,4BAAA;;AANF,KAIC,QAIC,IAAG;EACF,iBAAA;;AATH,KAIC,QAIC,IAAG,MAGF;EACC,cAAA;EACA,mBAAA;;AAbJ,KAkBC,QAAO;EACN,eAAA;;AAnBF,KAsBC,GACC;EACC,aAAA;;AAxBH,KA4BC,QAAO,MACN;EACC,eAAA;;AAKH;EACC,YAAA;;AAGD,EACC;EACC,gBAAA;EACA,WAAA","file":"index.css"}

web/views/@default/clusters/cluster/node/boards/index.less

@@ -1,3 +1,7 @@
+.message.loading {
+	padding: 1.5em;
+}
+
 .grid {
 	margin-top: 2em !important;
 	margin-left: 2em !important;