服务看板改成异步

internal/web/actions/default/servers/server/boards/index.go

@@ -41,6 +41,12 @@ func (this *IndexAction) RunGet(params struct {
 		"name": server.Name,
 	}
 
+	this.Show()
+}
+
+func (this *IndexAction) RunPost(params struct {
+	ServerId int64
+}) {
 	resp, err := this.RPC().ServerStatBoardRPC().ComposeServerStatBoard(this.AdminContext(), &pb.ComposeServerStatBoardRequest{ServerId: params.ServerId})
 	if err != nil {
 		this.ErrorPage(err)
@@ -151,6 +157,5 @@ func (this *IndexAction) RunGet(params struct {
 		}
 		this.Data["metricCharts"] = chartMaps
 	}
-
-	this.Show()
+	this.Success()
 }

internal/web/actions/default/servers/server/boards/init.go

@@ -13,7 +13,7 @@ func init() {
 			Helper(helpers.NewUserMustAuth(configloaders.AdminModuleCodeServer)).
 			Helper(serverutils.NewServerHelper()).
 			Prefix("/servers/server/boards").
-			Get("", new(IndexAction)).
+			GetPost("", new(IndexAction)).
 			EndAll()
 	})
 }

web/views/@default/servers/server/boards/index.html

@@ -7,6 +7,13 @@
     <menu-item :href="'/servers/server?serverId=' + server.id" active="true">"{{server.name}}"看板</menu-item>
 </first-menu>
 
+<!-- 加载中 -->
+<div style="margin-top: 0.8em">
+    <div class="ui message loading" v-if="isLoading">
+        <div class="ui active inline loader small"></div>  &nbsp; 数据加载中...
+    </div>
+</div>
+
 <div class="ui menu tabular">
     <a href="" class="item" :class="{active: trafficTab == 'hourly'}" @click.prevent="selectTrafficTab('hourly')">24小时流量趋势</a>
     <a href="" class="item" :class="{active: trafficTab == 'daily'}" @click.prevent="selectTrafficTab('daily')">15天流量趋势</a>

web/views/@default/servers/server/boards/index.js

@@ -1,4 +1,7 @@
 Tea.context(function () {
+	this.isLoading = true
+	this.metricCharts = []
+
 	this.formatCount = function (count) {
 		if (count < 1000) {
 			return count.toString()
@@ -15,11 +18,27 @@ Tea.context(function () {
 	this.trafficTab = "hourly"
 
 	this.$delay(function () {
-		this.reloadHourlyTrafficChart()
-		this.reloadHourlyRequestsChart()
-		this.reloadTopDomainsChart()
+		this.load()
 	})
 
+	this.load = function () {
+		this.$post("$")
+			.params({
+				serverId: this.server.id
+			})
+			.success(function (resp) {
+				for (let k in resp.data) {
+					this[k] = resp.data[k]
+				}
+
+				this.reloadHourlyTrafficChart()
+				this.reloadHourlyRequestsChart()
+				this.reloadTopDomainsChart()
+
+				this.isLoading = false
+			})
+	}
+
 	this.selectTrafficTab = function (tab) {
 		this.trafficTab = tab
 		if (tab == "hourly") {