实现WAF部分功能

web/public/js/components/server/http-firewall-rules-box.js

@@ -0,0 +1,50 @@
+Vue.component("http-firewall-rules-box", {
+	props: ["v-rules", "v-type"],
+	data: function () {
+		let rules = this.vRules
+		if (rules == null) {
+			rules = []
+		}
+		return {
+			rules: rules
+		}
+	},
+	methods: {
+		addRule: function () {
+			window.UPDATING_RULE = null
+			let that = this
+			teaweb.popup("/servers/components/waf/createRulePopup?type=" + this.vType, {
+				callback: function (resp) {
+					that.rules.push(resp.data.rule)
+				}
+			})
+		},
+		updateRule: function (index, rule) {
+			window.UPDATING_RULE = rule
+			let that = this
+			teaweb.popup("/servers/components/waf/createRulePopup?type=" + this.vType, {
+				callback: function (resp) {
+					Vue.set(that.rules, index, resp.data.rule)
+				}
+			})
+		},
+		removeRule: function (index) {
+			let that = this
+			teaweb.confirm("确定要删除此规则吗？", function () {
+				that.rules.$remove(index)
+			})
+		}
+	},
+	template: `<div>
+		<input type="hidden" name="rulesJSON" :value="JSON.stringify(rules)"/>
+		<div v-if="rules.length > 0">
+			<div v-for="(rule, index) in rules" class="ui label tiny" style="margin-bottom: 0.5em">
+				<span>{{rule.param}} <var>{{rule.operator}}</var> {{rule.value}}</span>
+				<a href="" title="修改" @click.prevent="updateRule(index, rule)"><i class="icon pencil small"></i></a>
+				<a href="" title="删除" @click.prevent="removeRule(index)"><i class="icon remove"></i></a>
+			</div>
+			<div class="ui divider"></div>
+		</div>
+		<button class="ui button tiny" type="button" @click.prevent="addRule()">+</button>
+</div>`
+})