From 40f32c7cf9d679bac391abf39f18e73a226a99e9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=88=98=E7=A5=A5=E8=B6=85?= <iwind.liu@gmail.com>
Date: Mon, 12 Jul 2021 18:06:43 +0800
Subject: [PATCH] =?UTF-8?q?=E8=AE=BF=E9=97=AE=E6=97=A5=E5=BF=97=E5=A2=9E?=
 =?UTF-8?q?=E5=8A=A0=E6=9B=B4=E5=AE=B9=E6=98=93=E5=8F=AF=E8=A7=86=E5=8C=96?=
 =?UTF-8?q?=E7=9A=84=E6=97=B6=E9=97=B4=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/server/http-access-log-box.js  |  3 +-
 web/views/@default/dashboard/boards/waf.js    | 17 ++++++++++
 .../@default/servers/server/log/index.js      | 32 ++++++++++++++-----
 3 files changed, 43 insertions(+), 9 deletions(-)

diff --git a/web/public/js/components/server/http-access-log-box.js b/web/public/js/components/server/http-access-log-box.js
index 62b5e645..939085b5 100644
--- a/web/public/js/components/server/http-access-log-box.js
+++ b/web/public/js/components/server/http-access-log-box.js
@@ -9,6 +9,7 @@ Vue.component("http-access-log-box", {
 				accessLog.scheme = "wss"
 			}
 		}
+
 		return {
 			accessLog: accessLog
 		}
@@ -48,7 +49,7 @@ Vue.component("http-access-log-box", {
 		}
 	},
 	template: `<div :style="{'color': (accessLog.status >= 400) ? '#dc143c' : ''}" ref="box">
-	<span v-if="accessLog.region != null && accessLog.region.length > 0" class="grey">[{{accessLog.region}}]</span> <keyword :v-word="vKeyword">{{accessLog.remoteAddr}}</keyword> [{{accessLog.timeLocal}}] <em>&quot;<keyword :v-word="vKeyword">{{accessLog.requestMethod}}</keyword> {{accessLog.scheme}}://<keyword :v-word="vKeyword">{{accessLog.host}}</keyword><keyword :v-word="vKeyword">{{accessLog.requestURI}}</keyword> <a :href="accessLog.scheme + '://' + accessLog.host + accessLog.requestURI" target="_blank" title="新窗口打开" class="disabled"><i class="external icon tiny"></i> </a> {{accessLog.proto}}&quot; </em> <keyword :v-word="vKeyword">{{accessLog.status}}</keyword> <code-label v-if="accessLog.attrs != null && accessLog.attrs['cache.status'] == 'HIT'">cache hit</code-label> <code-label v-if="accessLog.attrs != null && accessLog.attrs['waf.action'] != null && accessLog.attrs['waf.action'].length > 0">waf {{accessLog.attrs['waf.action']}}</code-label> - 耗时:{{formatCost(accessLog.requestTime)}} ms
+	<span v-if="accessLog.region != null && accessLog.region.length > 0" class="grey">[{{accessLog.region}}]</span> <keyword :v-word="vKeyword">{{accessLog.remoteAddr}}</keyword> [{{accessLog.timeLocal}}] <em>&quot;<keyword :v-word="vKeyword">{{accessLog.requestMethod}}</keyword> {{accessLog.scheme}}://<keyword :v-word="vKeyword">{{accessLog.host}}</keyword><keyword :v-word="vKeyword">{{accessLog.requestURI}}</keyword> <a :href="accessLog.scheme + '://' + accessLog.host + accessLog.requestURI" target="_blank" title="新窗口打开" class="disabled"><i class="external icon tiny"></i> </a> {{accessLog.proto}}&quot; </em> <keyword :v-word="vKeyword">{{accessLog.status}}</keyword> <code-label v-if="accessLog.attrs != null && accessLog.attrs['cache.status'] == 'HIT'">cache hit</code-label> <code-label v-if="accessLog.attrs != null && accessLog.attrs['waf.action'] != null && accessLog.attrs['waf.action'].length > 0">waf {{accessLog.attrs['waf.action']}}</code-label> - 耗时:{{formatCost(accessLog.requestTime)}} ms <span v-if="accessLog.humanTime != null && accessLog.humanTime.length > 0" class="grey small">&nbsp; ({{accessLog.humanTime}})</span>
 	&nbsp; <a href="" @click.prevent="showLog" title="查看详情"><i class="icon expand"></i></a>
 </div>`
 })
\ No newline at end of file
diff --git a/web/views/@default/dashboard/boards/waf.js b/web/views/@default/dashboard/boards/waf.js
index 65b81cef..bc58b94c 100644
--- a/web/views/@default/dashboard/boards/waf.js
+++ b/web/views/@default/dashboard/boards/waf.js
@@ -156,6 +156,10 @@ Tea.context(function () {
 		this.$post(".wafLogs")
 			.success(function (resp) {
 				if (resp.data.accessLogs != null) {
+					let that = this
+					resp.data.accessLogs.forEach(function (v) {
+						that.formatTime(v)
+					})
 					this.accessLogs = resp.data.accessLogs
 				}
 			})
@@ -163,4 +167,17 @@ Tea.context(function () {
 				this.$delay(this.reloadAccessLogs, 10000)
 			})
 	}
+
+	this.formatTime = function (accessLog) {
+		let elapsedSeconds = Math.ceil(new Date().getTime() / 1000) - accessLog.timestamp
+		if (elapsedSeconds >= 0) {
+			if (elapsedSeconds < 60) {
+				accessLog.humanTime = elapsedSeconds + "秒前"
+			} else if (elapsedSeconds < 3600) {
+				accessLog.humanTime = Math.ceil(elapsedSeconds / 60) + "分钟前"
+			} else if (elapsedSeconds < 3600 * 24) {
+				accessLog.humanTime = Math.ceil(elapsedSeconds / 3600) + "小时前"
+			}
+		}
+	}
 })
\ No newline at end of file
diff --git a/web/views/@default/servers/server/log/index.js b/web/views/@default/servers/server/log/index.js
index 6e5a392b..bd2e6f1b 100644
--- a/web/views/@default/servers/server/log/index.js
+++ b/web/views/@default/servers/server/log/index.js
@@ -16,14 +16,16 @@ Tea.context(function () {
 			.success(function (resp) {
 				this.accessLogs = resp.data.accessLogs.concat(this.accessLogs)
 
-                // 添加区域信息
-                this.accessLogs.forEach(function (accessLog) {
-                    if (typeof (resp.data.regions[accessLog.remoteAddr]) == "string") {
-                        accessLog.region = resp.data.regions[accessLog.remoteAddr]
-                    } else {
-                        accessLog.region = ""
-                    }
-                })
+				// 添加区域信息
+				let that = this
+				this.accessLogs.forEach(function (accessLog) {
+					that.formatTime(accessLog)
+					if (typeof (resp.data.regions[accessLog.remoteAddr]) == "string") {
+						accessLog.region = resp.data.regions[accessLog.remoteAddr]
+					} else {
+						accessLog.region = ""
+					}
+				})
 
 				let max = 100
 				if (this.accessLogs.length > max) {
@@ -45,4 +47,18 @@ Tea.context(function () {
 				}, 5000)
 			})
 	}
+
+
+	this.formatTime = function (accessLog) {
+		let elapsedSeconds = Math.ceil(new Date().getTime() / 1000) - accessLog.timestamp
+		if (elapsedSeconds >= 0) {
+			if (elapsedSeconds < 60) {
+				accessLog.humanTime = elapsedSeconds + "秒前"
+			} else if (elapsedSeconds < 3600) {
+				accessLog.humanTime = Math.ceil(elapsedSeconds / 60) + "分钟前"
+			} else if (elapsedSeconds < 3600 * 24) {
+				accessLog.humanTime = Math.ceil(elapsedSeconds / 3600) + "小时前"
+			}
+		}
+	}
 })
\ No newline at end of file