实现公用的IP名单

web/public/js/components/common/tip-message-box.js

@@ -0,0 +1,37 @@
+// 信息提示窗口
+Vue.component("tip-message-box", {
+	props: ["code"],
+	mounted: function () {
+		let that = this
+		Tea.action("/ui/showTip")
+			.params({
+				code: this.code
+			})
+			.success(function (resp) {
+				that.visible = resp.data.visible
+			})
+			.post()
+	},
+	data: function () {
+		return {
+			visible: false
+		}
+	},
+	methods: {
+		close: function () {
+			this.visible = false
+			Tea.action("/ui/hideTip")
+				.params({
+					code: this.code
+				})
+				.post()
+		}
+	},
+	template: `<div class="ui icon message" v-if="visible">
+	<i class="icon info circle"></i>
+	<i class="close icon" title="取消" @click.prevent="close"></i>
+	<div class="content">
+		<slot></slot>
+	</div>
+</div>`
+})

web/public/js/components/iplist/ip-list-bind-box.js

@@ -0,0 +1,62 @@
+// 绑定IP列表
+Vue.component("ip-list-bind-box", {
+	props: ["v-http-firewall-policy-id", "v-type"],
+	mounted: function () {
+		this.refresh()
+	},
+	data: function () {
+		return {
+			policyId: this.vHttpFirewallPolicyId,
+			type: this.vType,
+			lists: []
+		}
+	},
+	methods: {
+		bind: function () {
+			let that = this
+			teaweb.popup("/servers/iplists/bindHTTPFirewallPopup?httpFirewallPolicyId=" + this.policyId + "&type=" + this.type, {
+				width: "50em",
+				height: "34em",
+				callback: function () {
+
+				},
+				onClose: function () {
+					that.refresh()
+				}
+			})
+		},
+		remove: function (index, listId) {
+			let that = this
+			teaweb.confirm("确定要删除这个绑定的IP名单吗？", function () {
+				Tea.action("/servers/iplists/unbindHTTPFirewall")
+					.params({
+						httpFirewallPolicyId: that.policyId,
+						listId: listId
+					})
+					.post()
+					.success(function (resp) {
+						that.lists.$remove(index)
+					})
+			})
+		},
+		refresh: function () {
+			let that = this
+			Tea.action("/servers/iplists/httpFirewall")
+				.params({
+					httpFirewallPolicyId: this.policyId,
+					type: this.vType
+				})
+				.post()
+				.success(function (resp) {
+					that.lists = resp.data.lists
+				})
+		}
+	},
+	template: `<div>
+	<a href="" @click.prevent="bind()">绑定+</a> &nbsp; <span v-if="lists.length > 0"><span class="disabled small">|&nbsp;</span> 已绑定：</span>
+	<div class="ui label basic small" v-for="(list, index) in lists">
+		{{list.name}}
+		<a href="" title="删除" @click.prevent="remove(index, list.id)"><i class="icon remove small"></i></a>
+	</div>
+</div>`
+})

web/public/js/components/server/http-access-log-box.js

@@ -34,7 +34,7 @@ Vue.component("http-access-log-box", {
 			this.select()
 			teaweb.popup("/servers/server/log/viewPopup?requestId=" + requestId, {
 				width: "50em",
-				height: "24em",
+				height: "28em",
 				onClose: function () {
 					that.deselect()
 				}

web/views/@default/@layout.css

@@ -197,9 +197,6 @@ p.margin {
     padding-top: 2em;
     padding-bottom: 2.4em;
   }
-  .main-menu .ui.menu .item span {
-    display: none;
-  }
 }
 .main-menu .ui.labeled.icon.menu .item {
   font-size: 0.9em;
@@ -214,9 +211,19 @@ p.margin {
   margin-top: 0.5em;
   color: grey;
 }
+@media screen and (max-width: 512px) {
+  .main-menu .ui.menu .item.expend .subtitle {
+    display: none;
+  }
+}
 .main-menu .ui.menu .sub-items .item {
   padding-left: 2.8em !important;
 }
+@media screen and (max-width: 512px) {
+  .main-menu .ui.menu .sub-items .item {
+    padding-left: 1em!important;
+  }
+}
 .main-menu .ui.menu .sub-items .item.active {
   background-color: #2185d0 !important;
 }

web/views/@default/@layout.html

@@ -80,7 +80,7 @@
 					<span v-if="module.code.length > 0">
 						<i class="window restore outline icon" v-if="module.icon == null"></i>
 						<i class="ui icon" v-if="module.icon != null" :class="module.icon"></i>
-						<span>{{module.name}}</span>
+						<span class="module-name">{{module.name}}</span>
 					</span>
                     <div class="subtitle" v-if="module.subtitle != null && module.subtitle.length > 0">{{module.subtitle}}</div>
 				</a>

web/views/@default/@layout.less

@@ -139,7 +139,7 @@ div.margin, p.margin {
 	}
 
 	.main-menu .ui.menu .item span {
-		display: none;
+
 	}
 }
 
@@ -163,11 +163,23 @@ div.margin, p.margin {
 			color: grey;
 		}
 
+		@media screen and (max-width: 512px) {
+			.item.expend .subtitle {
+				display: none;
+			}
+		}
+
 		.sub-items {
 			.item {
 				padding-left: 2.8em !important;
 			}
 
+			@media screen and (max-width: 512px) {
+				.item {
+					padding-left: 1em!important;
+				}
+			}
+
 			.item.active {
 				background-color: #2185d0 !important;
 			}

web/views/@default/servers/components/waf/ipadmin/index.js

@@ -56,10 +56,13 @@ Tea.context(function () {
 	 * 添加IP名单菜单
 	 */
 	this.createIP = function (type) {
+		let that = this
 		teaweb.popup("/servers/components/waf/ipadmin/createIPPopup?firewallPolicyId=" + this.firewallPolicyId + '&type=' + type, {
 			height: "23em",
 			callback: function () {
-				window.location = "/servers/components/waf/ipadmin/lists?firewallPolicyId=" + this.firewallPolicyId + "&type=" + type
+				teaweb.success("保存成功", function () {
+					window.location = "/servers/components/waf/ipadmin/lists?firewallPolicyId=" + that.firewallPolicyId + "&type=" + type
+				})
 			}
 		})
 	}

web/views/@default/servers/components/waf/ipadmin/lists.html

@@ -4,6 +4,8 @@
 
 <second-menu style="margin-top: -1em">
     <span class="item">ID: {{listId}} &nbsp; <tip-icon content="ID可以用于使用API操作此IP名单"></tip-icon></span>
+    <span class="item disabled">|</span>
+    <div class="item"><ip-list-bind-box :v-http-firewall-policy-id="firewallPolicyId" :v-type="type"></ip-list-bind-box></div>
 </second-menu>
 
 <p class="comment" v-if="items.length == 0">暂时还没有IP。</p>

web/views/@default/servers/components/waf/ipadmin/lists.js

@@ -26,10 +26,13 @@ Tea.context(function () {
 	 * 添加IP名单菜单
 	 */
 	this.createIP = function (type) {
+		let that = this
 		teaweb.popup("/servers/components/waf/ipadmin/createIPPopup?firewallPolicyId=" + this.firewallPolicyId + '&type=' + type, {
 			height: "26em",
 			callback: function () {
-				window.location = "/servers/components/waf/ipadmin/lists?firewallPolicyId=" + this.firewallPolicyId + "&type=" + type
+				teaweb.success("保存成功", function () {
+					window.location = "/servers/components/waf/ipadmin/lists?firewallPolicyId=" + that.firewallPolicyId + "&type=" + type
+				})
 			}
 		})
 	}

web/views/@default/servers/components/waf/ipadmin/provinces.js

@@ -42,10 +42,13 @@ Tea.context(function () {
 	 * 添加IP名单菜单
 	 */
 	this.createIP = function (type) {
+		let that = this
 		teaweb.popup("/servers/components/waf/ipadmin/createIPPopup?firewallPolicyId=" + this.firewallPolicyId + '&type=' + type, {
 			height: "23em",
 			callback: function () {
-				window.location = "/servers/components/waf/ipadmin/lists?firewallPolicyId=" + this.firewallPolicyId + "&type=" + type
+				teaweb.success("保存成功", function () {
+					window.location = "/servers/components/waf/ipadmin/lists?firewallPolicyId=" + that.firewallPolicyId + "&type=" + type
+				})
 			}
 		})
 	}

web/views/@default/servers/components/waf/ipadmin/test.js

@@ -1,47 +1,50 @@
 Tea.context(function () {
-    this.ip = ""
-    this.result = {
-        isDone: false,
-        isOk: false,
-        isFound: false,
-        isAllowed: false,
-        error: "",
-        province: null,
-        country: null,
-        ipItem: null,
-        ipList: null
-    }
+	this.ip = ""
+	this.result = {
+		isDone: false,
+		isOk: false,
+		isFound: false,
+		isAllowed: false,
+		error: "",
+		province: null,
+		country: null,
+		ipItem: null,
+		ipList: null
+	}
 
-    this.$delay(function () {
-        this.$watch("ip", function () {
-            this.result.isDone = false
-        })
-    })
+	this.$delay(function () {
+		this.$watch("ip", function () {
+			this.result.isDone = false
+		})
+	})
 
-    this.success = function (resp) {
-        this.result = resp.data.result
-    }
+	this.success = function (resp) {
+		this.result = resp.data.result
+	}
 
-    this.updateItem = function (itemId) {
-        teaweb.popup(Tea.url(".updateIPPopup?firewallPolicyId=" + this.firewallPolicyId, {itemId: itemId}), {
-            height: "26em",
-            callback: function () {
-                teaweb.success("保存成功", function () {
-                    teaweb.reload()
-                })
-            }
-        })
-    }
+	this.updateItem = function (itemId) {
+		teaweb.popup(Tea.url(".updateIPPopup?firewallPolicyId=" + this.firewallPolicyId, {itemId: itemId}), {
+			height: "26em",
+			callback: function () {
+				teaweb.success("保存成功", function () {
+					teaweb.reload()
+				})
+			}
+		})
+	}
 
-    /**
-     * 添加IP名单菜单
-     */
-    this.createIP = function (type) {
-        teaweb.popup("/servers/components/waf/ipadmin/createIPPopup?firewallPolicyId=" + this.firewallPolicyId + '&type=' + type, {
-            height: "26em",
-            callback: function () {
-                window.location = "/servers/components/waf/ipadmin/lists?firewallPolicyId=" + this.firewallPolicyId + "&type=" + type
-            }
-        })
-    }
+	/**
+	 * 添加IP名单菜单
+	 */
+	this.createIP = function (type) {
+		let that = this
+		teaweb.popup("/servers/components/waf/ipadmin/createIPPopup?firewallPolicyId=" + this.firewallPolicyId + '&type=' + type, {
+			height: "26em",
+			callback: function () {
+				teaweb.success("保存成功", function () {
+					window.location = "/servers/components/waf/ipadmin/lists?firewallPolicyId=" + that.firewallPolicyId + "&type=" + type
+				})
+			}
+		})
+	}
 })

web/views/@default/servers/iplists/@list_menu.html

@@ -0,0 +1,10 @@
+<first-menu>
+    <menu-item :href="'/servers/iplists?type=' + list.type">{{list.typeName}}</menu-item>
+    <span class="disabled item">|</span>
+    <menu-item :href="'/servers/iplists/list?listId=' + list.id" code="list">"{{list.name}}"详情</menu-item>
+    <menu-item :href="'/servers/iplists/items?listId=' + list.id" code="item">IP({{list.countItems}})</menu-item>
+    <menu-item :href="'/servers/iplists/update?listId=' + list.id" code="update">修改</menu-item>
+    <menu-item :href="'/servers/iplists/test?listId=' + list.id" code="test">IP检查</menu-item>
+    <menu-item :href="'/servers/iplists/export?listId=' + list.id" code="export">导出</menu-item>
+    <menu-item :href="'/servers/iplists/import?listId=' + list.id" code="import">导入</menu-item>
+</first-menu>

web/views/@default/servers/iplists/@menu.html

@@ -0,0 +1,8 @@
+<first-menu>
+    <menu-item href="/servers/iplists" :active="type == 'black'">黑名单</menu-item>
+    <menu-item href="/servers/iplists?type=white" :active="type == 'white'">白名单</menu-item>
+    <span class="item disabled">|</span>
+    <menu-item @click.prevent="createList">[创建]</menu-item>
+    <span class="item disabled">|</span>
+    <span class="item"><tip-icon content="可以在WAF策略里直接引用这些公用名单。"></tip-icon></span>
+</first-menu>

web/views/@default/servers/iplists/bindHTTPFirewallPopup.html

@@ -0,0 +1,38 @@
+{$layout "layout_popup"}
+
+<h3>绑定公用IP名单</h3>
+
+
+<p class="comment" v-if="lists.length == 0">暂时还没有可用的公用IP名单。</p>
+
+<table class="ui table selectable celled" v-if="lists.length > 0">
+    <thead>
+    <tr>
+        <th class="two wide">ID</th>
+        <th>名称</th>
+        <th class="two wide">类型</th>
+        <th>备注</th>
+        <th class="two wide">IP数量</th>
+        <th class="two op">操作</th>
+    </tr>
+    </thead>
+    <tr v-for="list in lists">
+        <td>{{list.id}}</td>
+        <td>{{list.name}}</td>
+        <td>
+            <span v-if="list.type == 'black'">黑名单</span>
+            <span v-if="list.type == 'white'">白名单</span>
+        </td>
+        <td>{{list.description}}</td>
+        <td>
+            <span v-if="list.countItems > 0">{{list.countItems}}</span>
+            <span v-else class="disabled">0</span>
+        </td>
+        <td>
+            <a href="" @click.prevent="bind(list)" v-if="!list.isSelected">绑定</a>
+            <a href="" style="color: grey" @click.prevent="unbind(list)" v-if="list.isSelected">已绑定</a>
+        </td>
+    </tr>
+</table>
+
+<div class="page" v-html="page"></div>

web/views/@default/servers/iplists/bindHTTPFirewallPopup.js

@@ -0,0 +1,23 @@
+Tea.context(function () {
+	this.bind = function (list) {
+		this.$post("$")
+			.params({
+				httpFirewallPolicyId: this.httpFirewallPolicyId,
+				listId: list.id
+			})
+			.success(function () {
+				list.isSelected = true
+			})
+	}
+
+	this.unbind = function (list) {
+		this.$post(".unbindHTTPFirewall")
+			.params({
+				httpFirewallPolicyId: this.httpFirewallPolicyId,
+				listId: list.id
+			})
+			.success(function () {
+				list.isSelected = false
+			})
+	}
+})

web/views/@default/servers/iplists/createIPPopup.html

@@ -0,0 +1,76 @@
+{$layout "layout_popup"}
+
+<h3>添加IP</h3>
+
+<form method="post" class="ui form" data-tea-action="$" data-tea-success="success">
+	<input type="hidden" name="listId" :value="listId"/>
+	<csrf-token></csrf-token>
+	<table class="ui table definition selectable">
+        <tr>
+            <td class="title">类型 *</td>
+            <td>
+                <select class="ui dropdown auto-width" name="type" v-model="type">
+                    <option value="ipv4">IPv4</option>
+                    <option value="ipv6">IPv6</option>
+                    <option value="all">所有IP</option>
+                </select>
+                <p class="comment" v-if="type == 'ipv4'">单个IPv4或一个IPv4范围。</p>
+                <p class="comment" v-if="type == 'ipv6'">单个IPv6。</p>
+                <p class="comment" v-if="type == 'all'">允许或禁用所有的IP。</p>
+            </td>
+        </tr>
+
+        <!-- IPv4 -->
+        <tbody v-if="type == 'ipv4'">
+            <tr>
+                <td>开始IP *</td>
+                <td>
+                    <input type="text" name="ipFrom" maxlength="64" placeholder="x.x.x.x" ref="focus"/>
+                </td>
+            </tr>
+            <tr>
+                <td>结束IP</td>
+                <td>
+                    <input type="text" name="ipTo" maxlength="64" placeholder="x.x.x.x"/>
+                    <p class="comment">表示IP段的时候需要填写此项。</p>
+                </td>
+            </tr>
+        </tbody>
+
+        <!-- IPv6 -->
+        <tbody v-if="type == 'ipv6'">
+            <tr>
+                <td>IP *</td>
+                <td>
+                    <input type="text" name="ipFrom" maxlength="64" placeholder="x:x:x:x:x:x:x:x" ref="focus"/>
+                    <p class="comment">IPv6地址，比如 1406:3c00:0:2409:13:58:103:15</p>
+                </td>
+            </tr>
+        </tbody>
+
+        <tr>
+            <td>级别</td>
+            <td>
+                <firewall-event-level-options :v-value="eventLevel"></firewall-event-level-options>
+            </td>
+        </tr>
+
+		<tr>
+			<td colspan="2"><more-options-indicator></more-options-indicator></td>
+		</tr>
+		<tbody v-show="moreOptionsVisible">
+			<tr>
+				<td>过期时间</td>
+				<td>
+					<datetime-input :v-name="'expiredAt'"></datetime-input>
+					<p class="comment">在加入名单某一段时间后会失效，留空表示永久有效。</p>
+				</td>
+			</tr>
+			<tr>
+				<td>备注</td>
+				<td><input type="text" name="reason" maxlength="100"/></td>
+			</tr>
+		</tbody>
+	</table>
+	<submit-btn></submit-btn>
+</form>

web/views/@default/servers/iplists/createIPPopup.js

@@ -0,0 +1,4 @@
+Tea.context(function () {
+    this.type = "ipv4"
+    this.eventLevel = (this.listType == "white") ? "debug" : "critical"
+})

web/views/@default/servers/iplists/createPopup.css

@@ -0,0 +1,4 @@
+h3 var {
+  font-style: normal;
+}
+/*# sourceMappingURL=createPopup.css.map */

web/views/@default/servers/iplists/createPopup.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["createPopup.less"],"names":[],"mappings":"AAAA,EACC;EACC,kBAAA","file":"createPopup.css"}

web/views/@default/servers/iplists/createPopup.html

@@ -0,0 +1,31 @@
+{$layout "layout_popup"}
+
+<h3>创建<var v-if="type == 'black'">黑名单</var><var v-if="type == 'white'">白名单</var></h3>
+
+<form class="ui form" data-tea-action="$" data-tea-success="success">
+    <csrf-token></csrf-token>
+    <table class="ui table definition selectable">
+        <tr>
+            <td class="title">名称 *</td>
+            <td>
+                <input type="text" name="name" maxlength="100" ref="focus"/>
+            </td>
+        </tr>
+        <tr>
+            <td>类型</td>
+            <td>
+                <select class="ui dropdown auto-width" name="type" v-model="type">
+                    <option value="black">黑名单</option>
+                    <option value="white">白名单</option>
+                </select>
+            </td>
+        </tr>
+        <tr>
+            <td>备注</td>
+            <td>
+                <textarea name="description" rows="2" maxlength="200"></textarea>
+            </td>
+        </tr>
+    </table>
+    <submit-btn></submit-btn>
+</form>

web/views/@default/servers/iplists/createPopup.less

@@ -0,0 +1,5 @@
+h3 {
+	var {
+		font-style: normal;
+	}
+}

web/views/@default/servers/iplists/export.html

@@ -0,0 +1,13 @@
+{$layout}
+{$template "list_menu"}
+
+<div class="margin"></div>
+<form class="ui form">
+    <table class="ui table definition selectable">
+        <tr>
+            <td class="title">说明</td>
+            <td>导出所有的IP</td>
+        </tr>
+    </table>
+    <a :href="'/servers/iplists/exportData?listId=' + list.id" class="ui button primary">导出</a>
+</form>

web/views/@default/servers/iplists/import.html

@@ -0,0 +1,19 @@
+{$layout}
+{$template "list_menu"}
+
+<div class="margin"></div>
+
+<form class="ui form" data-tea-action="$"  data-tea-success="success">
+    <input type="hidden" name="listId" :value="list.id"/>
+    <csrf-token></csrf-token>
+    <table class="ui table definition selectable">
+        <tr>
+            <td class="title">选择IP文件 *</td>
+            <td>
+                <input type="file" name="file" accept=".data"/>
+                <p class="comment">文件名类似于<code-label>ip-list-123.data</code-label>。</p>
+            </td>
+        </tr>
+    </table>
+    <submit-btn></submit-btn>
+</form>

web/views/@default/servers/iplists/import.js

@@ -0,0 +1,7 @@
+Tea.context(function () {
+	this.success = function (resp) {
+		teaweb.success("成功导入" + resp.data.count + "个IP", function () {
+			teaweb.reload()
+		})
+	}
+})

web/views/@default/servers/iplists/index.html

@@ -0,0 +1,38 @@
+{$layout}
+{$template "menu"}
+
+<tip-message-box code="iplist-public-tip">这里是公用的IP名单，可以在WAF策略里直接引用。</tip-message-box>
+
+<p class="comment" v-if="lists.length == 0">暂时还没有公用IP名单。</p>
+
+<table class="ui table selectable celled" v-if="lists.length > 0">
+    <thead>
+        <tr>
+            <th class="one wide">ID</th>
+            <th>名称</th>
+            <th class="one wide">类型</th>
+            <th>备注</th>
+            <th class="one wide">IP数量</th>
+            <th class="two op">操作</th>
+        </tr>
+    </thead>
+    <tr v-for="list in lists">
+        <td>{{list.id}}</td>
+        <td>{{list.name}}</td>
+        <td>
+            <span v-if="list.type == 'black'">黑名单</span>
+            <span v-if="list.type == 'white'">白名单</span>
+        </td>
+        <td>{{list.description}}</td>
+        <td>
+            <span v-if="list.countItems > 0">{{list.countItems}}</span>
+            <span v-else class="disabled">0</span>
+        </td>
+        <td>
+            <a :href="'/servers/iplists/list?listId=' + list.id">详情</a> &nbsp;
+            <a href="" @click.prevent="deleteList(list.id)">删除</a>
+        </td>
+    </tr>
+</table>
+
+<div class="page" v-html="page"></div>

web/views/@default/servers/iplists/index.js

@@ -0,0 +1,26 @@
+Tea.context(function () {
+	this.createList = function () {
+		teaweb.popup(Tea.url(".createPopup", {type: this.type}), {
+			callback: function (resp) {
+				teaweb.success("保存成功", function () {
+					window.location = "/servers/iplists?type=" + resp.data.list.type
+				})
+			}
+		})
+	}
+
+	this.deleteList = function (listId) {
+		let that = this
+		teaweb.confirm("确定要删除此IP名单吗？", function () {
+			that.$post(".delete")
+				.params({
+					listId: listId
+				})
+				.success(function () {
+					teaweb.success("删除成功", function () {
+						teaweb.reload()
+					})
+				})
+		})
+	}
+})

web/views/@default/servers/iplists/items.html

@@ -0,0 +1,12 @@
+{$layout}
+{$template "list_menu"}
+
+<second-menu>
+    <menu-item @click.prevent="createIP">[创建IP]</menu-item>
+</second-menu>
+
+<p class="comment" v-if="items.length == 0">暂时还没有IP。</p>
+
+<ip-list-table v-if="items.length > 0" :v-items="items" @update-item="updateItem" @delete-item="deleteItem"></ip-list-table>
+
+<div class="page" v-html="page"></div>

web/views/@default/servers/iplists/items.js

@@ -0,0 +1,37 @@
+Tea.context(function () {
+	this.updateItem = function (itemId) {
+		teaweb.popup(Tea.url(".updateIPPopup", {itemId: itemId}), {
+			height: "26em",
+			callback: function () {
+				teaweb.success("保存成功", function () {
+					teaweb.reload()
+				})
+			}
+		})
+	}
+
+	this.deleteItem = function (itemId) {
+		let that = this
+		teaweb.confirm("确定要删除这个IP吗？", function () {
+			that.$post(".deleteIP")
+				.params({
+					"itemId": itemId
+				})
+				.refresh()
+		})
+	}
+
+	/**
+	 * 添加IP名单菜单
+	 */
+	this.createIP = function () {
+		teaweb.popup(Tea.url(".createIPPopup", {listId: this.list.id}), {
+			height: "23em",
+			callback: function () {
+				teaweb.success("保存成功", function () {
+					teaweb.reload()
+				})
+			}
+		})
+	}
+})

web/views/@default/servers/iplists/list.html

@@ -0,0 +1,24 @@
+{$layout}
+{$template "list_menu"}
+
+<table class="ui table definition selectable">
+    <tr>
+        <td class="title">名称</td>
+        <td>
+            {{list.name}}
+        </td>
+    </tr>
+    <tr>
+        <td>类型</td>
+        <td>
+            {{list.typeName}}
+        </td>
+    </tr>
+    <tr>
+        <td>备注</td>
+        <td>
+            <span v-if="list.description.length > 0">{{list.description}}</span>
+            <span v-else class="disabled">-</span>
+        </td>
+    </tr>
+</table>

web/views/@default/servers/iplists/test.html

@@ -0,0 +1,39 @@
+{$layout}
+{$template "list_menu"}
+<form method="post" class="ui form" data-tea-action="$" data-tea-success="success">
+    <csrf-token></csrf-token>
+    <input type="hidden" name="listId" :value="list.id"/>
+    <table class="ui table selectable definition">
+        <tr>
+            <td class="title">IP *</td>
+            <td>
+                <input type="text" name="ip" class="text" maxlength="100" ref="focus" placeholder="x.x.x.x" v-model="ip"/>
+                <p class="comment">要检查的IP</p>
+            </td>
+        </tr>
+        <tr>
+            <td>检查结果</td>
+            <td>
+                <div v-if="result.isDone">
+                    <div v-if="!result.isOk">
+                        <span class="red">{{result.error}}</span>
+                    </div>
+                    <div v-if="result.isFound">
+                        <div v-if="result.item != null">
+                            <div v-if="result.isAllowed">
+                                <span class="green">在白名单中 <ip-item-text :v-item="result.item"></ip-item-text>&nbsp;<a href="" @click.prevent="updateItem(result.list.id, result.item.id)" title="查看和修改"><i class="icon pencil small"></i></a></span>
+                            </div>
+                            <div v-else>
+                                <span class="red">在黑名单中 <ip-item-text :v-item="result.item"></ip-item-text>&nbsp;<a href="" @click.prevent="updateItem(result.item.id)" title="查看和修改"><i class="icon pencil small"></i></a></span>
+                            </div>
+                        </div>
+                    </div>
+                    <div v-if="!result.isFound">
+                        没有找到和{{ip}}匹配的配置。
+                    </div>
+                </div>
+            </td>
+        </tr>
+    </table>
+    <submit-btn>检查IP状态</submit-btn>
+</form>

web/views/@default/servers/iplists/test.js

@@ -0,0 +1,33 @@
+Tea.context(function () {
+	this.ip = ""
+	this.result = {
+		isDone: false,
+		isOk: false,
+		isFound: false,
+		isAllowed: false,
+		error: "",
+		ipItem: null,
+		ipList: null
+	}
+
+	this.$delay(function () {
+		this.$watch("ip", function () {
+			this.result.isDone = false
+		})
+	})
+
+	this.success = function (resp) {
+		this.result = resp.data.result
+	}
+
+	this.updateItem = function (itemId) {
+		teaweb.popup(Tea.url(".updateIPPopup", {itemId: itemId}), {
+			height: "26em",
+			callback: function () {
+				teaweb.success("保存成功", function () {
+					teaweb.reload()
+				})
+			}
+		})
+	}
+})

web/views/@default/servers/iplists/update.html

@@ -0,0 +1,28 @@
+{$layout}
+{$template "list_menu"}
+
+<form class="ui form" data-tea-action="$" data-tea-success="success">
+    <input type="hidden" name="listId" :value="list.id"/>
+    <csrf-token></csrf-token>
+    <table class="ui table definition selectable">
+        <tr>
+            <td class="title">名称 *</td>
+            <td>
+                <input type="text" name="name" maxlength="100" ref="focus" v-model="list.name"/>
+            </td>
+        </tr>
+        <tr>
+            <td>类型</td>
+            <td>
+                {{list.typeName}}
+            </td>
+        </tr>
+        <tr>
+            <td>备注</td>
+            <td>
+                <textarea name="description" rows="2" maxlength="200" v-model="list.description"></textarea>
+            </td>
+        </tr>
+    </table>
+    <submit-btn></submit-btn>
+</form>

web/views/@default/servers/iplists/update.js

@@ -0,0 +1,3 @@
+Tea.context(function () {
+	this.success = NotifyReloadSuccess("保存成功")
+})

web/views/@default/servers/iplists/updateIPPopup.html

@@ -0,0 +1,76 @@
+{$layout "layout_popup"}
+
+<h3>修改IP</h3>
+
+<form method="post" class="ui form" data-tea-action="$" data-tea-success="success">
+	<input type="hidden" name="itemId" :value="item.id"/>
+    <input type="hidden" name="type" :value="item.type"/>
+	<csrf-token></csrf-token>
+	<table class="ui table definition selectable">
+        <tr>
+            <td class="title">类型 *</td>
+            <td>
+                <!-- 类型不允许修改 -->
+                <span v-if="item.type == 'ipv4'">IPv4</span>
+                <span v-if="item.type == 'ipv6'">IPv6</span>
+                <span v-if="item.type == 'all'">所有IP</span>
+
+                <p class="comment" v-if="type == 'ipv4'">单个IPv4或一个IPv4范围。</p>
+                <p class="comment" v-if="type == 'ipv6'">单个IPv6。</p>
+                <p class="comment" v-if="type == 'all'">允许或禁用所有的IP。</p>
+            </td>
+        </tr>
+
+        <!-- IPv4 -->
+        <tbody v-if="type == 'ipv4'">
+        <tr>
+            <td>开始IP *</td>
+            <td>
+                <input type="text" name="ipFrom" maxlength="64" placeholder="x.x.x.x" ref="focus" v-model="item.ipFrom"/>
+            </td>
+        </tr>
+        <tr>
+            <td>结束IP</td>
+            <td>
+                <input type="text" name="ipTo" maxlength="64" placeholder="x.x.x.x" v-model="item.ipTo"/>
+                <p class="comment">表示IP段的时候需要填写此项。</p>
+            </td>
+        </tr>
+        </tbody>
+
+        <tr>
+            <td>级别</td>
+            <td>
+                <firewall-event-level-options :v-value="item.eventLevel"></firewall-event-level-options>
+            </td>
+        </tr>
+
+        <!-- IPv6 -->
+        <tbody v-if="type == 'ipv6'">
+        <tr>
+            <td>IP *</td>
+            <td>
+                <input type="text" name="ipFrom" maxlength="64" placeholder="x:x:x:x:x:x:x:x" ref="focus" v-model="item.ipFrom"/>
+                <p class="comment">IPv6地址，比如 1406:3c00:0:2409:13:58:103:15</p>
+            </td>
+        </tr>
+        </tbody>
+		<tr>
+			<td colspan="2"><more-options-indicator></more-options-indicator></td>
+		</tr>
+		<tbody v-show="moreOptionsVisible">
+			<tr>
+				<td>过期时间</td>
+				<td>
+					<datetime-input :v-name="'expiredAt'" :v-timestamp="item.expiredAt"></datetime-input>
+					<p class="comment">在加入名单某一段时间后会失效，留空表示永久有效。</p>
+				</td>
+			</tr>
+			<tr>
+				<td>备注</td>
+				<td><input type="text" name="reason" maxlength="100" v-model="item.reason"/></td>
+			</tr>
+		</tbody>
+	</table>
+	<submit-btn></submit-btn>
+</form>

web/views/@default/servers/server/settings/waf/ipadmin/allowList.html

@@ -11,6 +11,8 @@
         <menu-item @click.prevent="createIP('white')">添加IP</menu-item>
         <span class="item">|</span>
         <span class="item">ID: {{listId}} &nbsp; <tip-icon content="ID可以用于使用API操作此IP名单"></tip-icon></span>
+        <span class="item">|</span>
+        <div class="item"><ip-list-bind-box :v-http-firewall-policy-id="firewallPolicyId" :v-type="'white'"></ip-list-bind-box></div>
     </second-menu>
 
     <p class="ui message warning" v-if="!wafIsOn">当前WAF未启用，设置将在<a :href="'/servers/server/settings/waf?serverId=' + serverId">[启用]</a>后生效。</p>

web/views/@default/servers/server/settings/waf/ipadmin/allowList.js

@@ -29,7 +29,9 @@ Tea.context(function () {
 		teaweb.popup("/servers/server/settings/waf/ipadmin/createIPPopup?listId=" + this.listId + '&type=' + type, {
 			height: "26em",
 			callback: function () {
-				window.location.reload()
+				teaweb.success("保存成功", function () {
+					teaweb.reload()
+				})
 			}
 		})
 	}

web/views/@default/servers/server/settings/waf/ipadmin/countries.js

@@ -56,10 +56,13 @@ Tea.context(function () {
 	 * 添加IP名单菜单
 	 */
 	this.createIP = function (type) {
+		let that = this
 		teaweb.popup("/servers/components/waf/ipadmin/createIPPopup?firewallPolicyId=" + this.firewallPolicyId + '&type=' + type, {
 			height: "30em",
 			callback: function () {
-				window.location = "/servers/components/waf/ipadmin/lists?firewallPolicyId=" + this.firewallPolicyId + "&type=" + type
+				teaweb.success("保存成功", function () {
+					window.location = "/servers/components/waf/ipadmin/lists?firewallPolicyId=" + that.firewallPolicyId + "&type=" + type
+				})
 			}
 		})
 	}

web/views/@default/servers/server/settings/waf/ipadmin/denyList.html

@@ -11,6 +11,8 @@
         <menu-item @click.prevent="createIP('black')">添加IP</menu-item>
         <span class="item">|</span>
         <span class="item">ID: {{listId}} &nbsp; <tip-icon content="ID可以用于使用API操作此IP名单"></tip-icon></span>
+        <span class="item">|</span>
+        <div class="item"><ip-list-bind-box :v-http-firewall-policy-id="firewallPolicyId" :v-type="'black'"></ip-list-bind-box></div>
     </second-menu>
 
     <p class="ui message warning" v-if="!wafIsOn">当前WAF未启用，设置将在<a :href="'/servers/server/settings/waf?serverId=' + serverId">[启用]</a>后生效。</p>

web/views/@default/servers/server/settings/waf/ipadmin/denyList.js

@@ -29,7 +29,9 @@ Tea.context(function () {
 		teaweb.popup("/servers/server/settings/waf/ipadmin/createIPPopup?listId=" + this.listId + '&type=' + type, {
 			height: "26em",
 			callback: function () {
-				window.location.reload()
+				teaweb.success("保存成功", function () {
+					teaweb.reload()
+				})
 			}
 		})
 	}

web/views/@default/servers/server/settings/waf/ipadmin/provinces.js

@@ -42,10 +42,13 @@ Tea.context(function () {
 	 * 添加IP名单菜单
 	 */
 	this.createIP = function (type) {
+		let that = this
 		teaweb.popup("/servers/components/waf/ipadmin/createIPPopup?firewallPolicyId=" + this.firewallPolicyId + '&type=' + type, {
 			height: "30em",
 			callback: function () {
-				window.location = "/servers/components/waf/ipadmin/lists?firewallPolicyId=" + this.firewallPolicyId + "&type=" + type
+				teaweb.success("保存成功", function () {
+					window.location = "/servers/components/waf/ipadmin/lists?firewallPolicyId=" + that.firewallPolicyId + "&type=" + type
+				})
 			}
 		})
 	}

web/views/@default/servers/server/stat/clients.css

@@ -1,4 +1,7 @@
 .chart-box {
   height: 20em;
 }
+h4 span.small {
+  font-size: 0.8em;
+}
 /*# sourceMappingURL=clients.css.map */

web/views/@default/servers/server/stat/clients.css.map

@@ -1 +1 @@
-{"version":3,"sources":["clients.less"],"names":[],"mappings":"AAAA;EACC,YAAA","file":"clients.css"}
+{"version":3,"sources":["clients.less"],"names":[],"mappings":"AAAA;EACC,YAAA;;AAGD,EAAG,KAAI;EACN,gBAAA","file":"clients.css"}

web/views/@default/servers/server/stat/clients.html

@@ -12,10 +12,10 @@
         要想查看统计数据，需要先开启统计功能，<a :href="'/servers/server/settings/stat?serverId=' + serverId">[点击这里]</a>修改配置。
     </p>
     {$else}
-    <h4>操作系统排行</h4>
+    <h4>操作系统排行<span class="small grey">（按月）</span></h4>
     <div class="chart-box" id="system-chart"></div>
 
-    <h4>浏览器排行</h4>
+    <h4>浏览器排行<span class="small grey">（按月）</span></h4>
     <div class="chart-box" id="browser-chart"></div>
     {$end}
 </div>

web/views/@default/servers/server/stat/clients.less

@@ -1,3 +1,7 @@
 .chart-box {
 	height: 20em;
+}
+
+h4 span.small {
+	font-size: 0.8em;
 }

web/views/@default/servers/server/stat/dailyRequests.css

@@ -1,4 +1,7 @@
 .chart-box {
   height: 21em;
 }
+h4 span.small {
+  font-size: 0.8em;
+}
 /*# sourceMappingURL=dailyRequests.css.map */

web/views/@default/servers/server/stat/dailyRequests.css.map

@@ -1 +1 @@
-{"version":3,"sources":["dailyRequests.less"],"names":[],"mappings":"AAAA;EACC,YAAA","file":"dailyRequests.css"}
+{"version":3,"sources":["dailyRequests.less"],"names":[],"mappings":"AAAA;EACC,YAAA;;AAGD,EAAG,KAAI;EACN,gBAAA","file":"dailyRequests.css"}

web/views/@default/servers/server/stat/dailyRequests.less

@@ -1,3 +1,7 @@
 .chart-box {
 	height: 21em;
+}
+
+h4 span.small {
+	font-size: 0.8em;
 }

web/views/@default/servers/server/stat/hourlyRequests.css

@@ -1,4 +1,7 @@
 .chart-box {
   height: 21em;
 }
+h4 span.small {
+  font-size: 0.8em;
+}
 /*# sourceMappingURL=hourlyRequests.css.map */

web/views/@default/servers/server/stat/hourlyRequests.css.map

@@ -1 +1 @@
-{"version":3,"sources":["hourlyRequests.less"],"names":[],"mappings":"AAAA;EACC,YAAA","file":"hourlyRequests.css"}
+{"version":3,"sources":["hourlyRequests.less"],"names":[],"mappings":"AAAA;EACC,YAAA;;AAGD,EAAG,KAAI;EACN,gBAAA","file":"hourlyRequests.css"}

web/views/@default/servers/server/stat/hourlyRequests.less

@@ -1,3 +1,7 @@
 .chart-box {
 	height: 21em;
+}
+
+h4 span.small {
+	font-size: 0.8em;
 }

web/views/@default/servers/server/stat/index.css

@@ -1,4 +1,7 @@
 .chart-box {
   height: 21em;
 }
+h4 span.small {
+  font-size: 0.8em;
+}
 /*# sourceMappingURL=index.css.map */

web/views/@default/servers/server/stat/index.css.map

@@ -1 +1 @@
-{"version":3,"sources":["index.less"],"names":[],"mappings":"AAAA;EACC,YAAA","file":"index.css"}
+{"version":3,"sources":["index.less"],"names":[],"mappings":"AAAA;EACC,YAAA;;AAGD,EAAG,KAAI;EACN,gBAAA","file":"index.css"}

web/views/@default/servers/server/stat/index.less

@@ -1,3 +1,7 @@
 .chart-box {
 	height: 21em;
+}
+
+h4 span.small {
+	font-size: 0.8em;
 }

web/views/@default/servers/server/stat/providers.css

@@ -1,4 +1,7 @@
 .chart-box {
   height: 20em;
 }
+h4 span.small {
+  font-size: 0.8em;
+}
 /*# sourceMappingURL=providers.css.map */

web/views/@default/servers/server/stat/providers.css.map

@@ -1 +1 @@
-{"version":3,"sources":["providers.less"],"names":[],"mappings":"AAAA;EACC,YAAA","file":"providers.css"}
+{"version":3,"sources":["providers.less"],"names":[],"mappings":"AAAA;EACC,YAAA;;AAGD,EAAG,KAAI;EACN,gBAAA","file":"providers.css"}

web/views/@default/servers/server/stat/providers.html

@@ -12,7 +12,7 @@
         要想查看统计数据，需要先开启统计功能，<a :href="'/servers/server/settings/stat?serverId=' + serverId">[点击这里]</a>修改配置。
     </p>
     {$else}
-    <h4>运营商排行</h4>
+    <h4>运营商排行<span class="small grey">（按月）</span></h4>
     <div class="chart-box" id="provider-chart"></div>
     {$end}
 </div>

web/views/@default/servers/server/stat/providers.less

@@ -1,3 +1,7 @@
 .chart-box {
 	height: 20em;
+}
+
+h4 span.small {
+	font-size: 0.8em;
 }

web/views/@default/servers/server/stat/regions.css

@@ -1,4 +1,7 @@
 .chart-box {
   height: 20em;
 }
-/*# sourceMappingURL=index.css.map */
+h4 span.small {
+  font-size: 0.8em;
+}
+/*# sourceMappingURL=regions.css.map */

web/views/@default/servers/server/stat/regions.css.map

@@ -1 +1 @@
-{"version":3,"sources":["index.less"],"names":[],"mappings":"AAAA;EACC,YAAA","file":"index.css"}
+{"version":3,"sources":["regions.less"],"names":[],"mappings":"AAAA;EACC,YAAA;;AAGD,EAAG,KAAI;EACN,gBAAA","file":"regions.css"}

web/views/@default/servers/server/stat/regions.html

@@ -12,17 +12,17 @@
         要想查看统计数据，需要先开启统计功能，<a :href="'/servers/server/settings/stat?serverId=' + serverId">[点击这里]</a>修改配置。
     </p>
     {$else}
-        <h4>地区排行</h4>
+        <h4>地区排行<span class="small grey">（按月）</span></h4>
         <div class="chart-box" id="country-chart">
 
         </div>
 
-        <h4>省市排行</h4>
+        <h4>省市排行<span class="small grey">（按月）</span></h4>
         <div class="chart-box" id="province-chart">
 
         </div>
 
-        <h4>城市排行</h4>
+        <h4>城市排行<span class="small grey">（按月）</span></h4>
         <div class="chart-box" id="city-chart">
 
         </div>

web/views/@default/servers/server/stat/regions.less

@@ -1,3 +1,7 @@
 .chart-box {
 	height: 20em;
+}
+
+h4 span.small {
+	font-size: 0.8em;
 }