DNS访问日志可以使用关键词搜索

web/public/js/components/common/keyword.js

@@ -0,0 +1,21 @@
+Vue.component("keyword", {
+	props: ["v-word"],
+	data: function () {
+		let word = this.vWord
+		if (word == null) {
+			word = ""
+		}
+
+		let slot = this.$slots["default"][0]
+		let text = slot.text
+		if (word.length > 0) {
+			text = text.replace(new RegExp(word, "g"), "<span style=\"border: 1px #ccc dashed\">" + word + "</span>")
+		}
+
+		return {
+			word: word,
+			text: text
+		}
+	},
+	template: `<span><span style="display: none"><slot></slot></span><span v-html="text"></span></span>`
+})

web/public/js/components/ns/ns-access-log-box.js

@@ -1,5 +1,5 @@
 Vue.component("ns-access-log-box", {
-	props: ["v-access-log"],
+	props: ["v-access-log", "v-keyword"],
 	data: function () {
 		let accessLog = this.vAccessLog
 		return {
@@ -33,6 +33,6 @@ Vue.component("ns-access-log-box", {
 		}
 	},
 	template: `<div class="access-log-row" :style="{'color': (accessLog.nsRecordId == null || accessLog.nsRecordId == 0) ? '#dc143c' : ''}" ref="box">
-	<span v-if="accessLog.region != null && accessLog.region.length > 0" class="grey">[{{accessLog.region}}]</span> {{accessLog.remoteAddr}} [{{accessLog.timeLocal}}] [{{accessLog.networking}}] <em>{{accessLog.questionType}} {{accessLog.questionName}}</em> -&gt; <em>{{accessLog.recordType}} {{accessLog.recordValue}}</em><!-- &nbsp; <a href="" @click.prevent="showLog" title="查看详情"><i class="icon expand"></i></a>-->
+	<span v-if="accessLog.region != null && accessLog.region.length > 0" class="grey">[{{accessLog.region}}]</span> <keyword :v-word="vKeyword">{{accessLog.remoteAddr}}</keyword> [{{accessLog.timeLocal}}] [{{accessLog.networking}}] <em>{{accessLog.questionType}} <keyword :v-word="vKeyword">{{accessLog.questionName}}</keyword></em> -&gt; <em>{{accessLog.recordType}} <keyword :v-word="vKeyword">{{accessLog.recordValue}}</keyword></em><!-- &nbsp; <a href="" @click.prevent="showLog" title="查看详情"><i class="icon expand"></i></a>-->
 </div>`
 })