mirror of
https://github.com/TeaOSLab/EdgeAdmin.git
synced 2025-12-15 04:26:36 +08:00
增加IP级别和WAF动作
This commit is contained in:
刘祥超
@@ -0,0 +1,97 @@
|
||||
{$layout "layout_popup"}
|
||||
|
||||
<h3>添加动作</h3>
|
||||
<form class="ui form" data-tea-action="$" data-tea-success="success">
|
||||
<input type="hidden" name="clusterId" :value="clusterId"/>
|
||||
<csrf-token></csrf-token>
|
||||
|
||||
<table class="ui table selectable definition">
|
||||
<tr>
|
||||
<td class="title">名称 *</td>
|
||||
<td>
|
||||
<input type="text" name="name" maxlength="50" ref="focus"/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>级别</td>
|
||||
<td>
|
||||
<firewall-event-level-options :v-value="'critical'"></firewall-event-level-options>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>类型</td>
|
||||
<td>
|
||||
<select class="ui dropdown auto-width" name="type" v-model="type">
|
||||
<option value="">[请选择]</option>
|
||||
<option v-for="type in actionTypes" :value="type.code">{{type.name}}</option>
|
||||
</select>
|
||||
<p class="comment">{{typeDescription}}</p>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- IPSet -->
|
||||
<tbody v-if="type == 'ipset'">
|
||||
<tr>
|
||||
<td>IPSet白名单名称 *</td>
|
||||
<td>
|
||||
<input type="text" name="ipsetWhiteName" value="edge_white_list" maxlength="64"/>
|
||||
<p class="comment">只能是英文、数字、下划线的组合。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>IPSet黑名单名称 *</td>
|
||||
<td>
|
||||
<input type="text" name="ipsetBlackName" value="edge_black_list" maxlength="64"/>
|
||||
<p class="comment">只能是英文、数字、下划线的组合。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>创建IPTables规则</td>
|
||||
<td>
|
||||
<checkbox name="ipsetAutoAddToIPTables" :value="true"></checkbox>
|
||||
<p class="comment">是否尝试自动创建包含有此IPSet的IPTables规则。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>创建Firewalld规则</td>
|
||||
<td>
|
||||
<checkbox name="ipsetAutoAddToFirewalld" :value="true"></checkbox>
|
||||
<p class="comment">是否尝试自动创建包含有此IPSet的Firewalld规则。</p>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
|
||||
<!-- Firewalld -->
|
||||
<tbody v-if="type == 'firewalld'">
|
||||
|
||||
</tbody>
|
||||
|
||||
<!-- IPTables -->
|
||||
<tbody v-if="type == 'iptables'">
|
||||
|
||||
</tbody>
|
||||
|
||||
<!-- 脚本 -->
|
||||
<tbody v-if="type == 'script'">
|
||||
<tr>
|
||||
<td>脚本路径 *</td>
|
||||
<td>
|
||||
<input type="text" name="scriptPath" maxlength="200"/>
|
||||
<p class="comment">可执行脚本文件的完整路径。</p>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
|
||||
<!-- HTTP API -->
|
||||
<tbody v-if="type == 'httpAPI'">
|
||||
<tr>
|
||||
<td>API URL *</td>
|
||||
<td>
|
||||
<input type="text" name="httpAPIURL" maxlength="200" placeholder="http|https://..."/>
|
||||
<p class="comment">完整的API地址。</p>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<submit-btn></submit-btn>
|
||||
</form>
|
||||
@@ -0,0 +1,30 @@
|
||||
Tea.context(function () {
|
||||
this.$delay(function () {
|
||||
let that = this
|
||||
|
||||
// 类型
|
||||
this.$watch("type", function () {
|
||||
that.changeType()
|
||||
})
|
||||
|
||||
this.changeType()
|
||||
})
|
||||
|
||||
/**
|
||||
* 类型
|
||||
*/
|
||||
this.type = ""
|
||||
this.typeDescription = ""
|
||||
|
||||
this.changeType = function () {
|
||||
let that = this
|
||||
let t = this.actionTypes.$find(function (k, v) {
|
||||
return v.code == that.type
|
||||
})
|
||||
if (t != null) {
|
||||
this.typeDescription = t.description
|
||||
} else {
|
||||
this.typeDescription = ""
|
||||
}
|
||||
}
|
||||
})
|
||||
@@ -0,0 +1,36 @@
|
||||
{$layout}
|
||||
{$template "/left_menu"}
|
||||
|
||||
<div class="right-box">
|
||||
<first-menu>
|
||||
<menu-item @click.prevent="createAction">添加动作</menu-item>
|
||||
<span class="item disabled">|</span>
|
||||
<span class="item"><tip-icon content="可以设置WAF中的规则集和IP名单中的IP级别，从而在匹配时触发对应的动作。"></tip-icon></span>
|
||||
</first-menu>
|
||||
|
||||
<div class="margin"></div>
|
||||
<div v-if="!hasActions">
|
||||
<p class="comment">暂时还没有自定义动作。</p>
|
||||
</div>
|
||||
<div v-for="level in levels" v-if="level.actions.length > 0">
|
||||
<h4 style="margin-bottom: 0">{{level.name}}级别</h4>
|
||||
<p class="comment" v-if="level.actions.length == 0">暂时还没有定义动作。</p>
|
||||
<table class="ui table selectable" v-if="level.actions.length > 0">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>名称</th>
|
||||
<th class="four wide">类型</th>
|
||||
<th class="two op">操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tr v-for="action in level.actions">
|
||||
<td>{{action.name}}</td>
|
||||
<td>{{action.typeName}}</td>
|
||||
<td>
|
||||
<a href="" @click.prevent="updateAction(action.id)">修改</a> <a href="" @click.prevent="deleteAction(action.id)">删除</a>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<div class="ui divider"></div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,36 @@
|
||||
Tea.context(function () {
|
||||
this.createAction = function () {
|
||||
teaweb.popup(Tea.url(".createPopup", {clusterId: this.clusterId}), {
|
||||
callback: function () {
|
||||
teaweb.success("保存成功", function () {
|
||||
teaweb.reload()
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
this.updateAction = function (actionId) {
|
||||
teaweb.popup(Tea.url(".updatePopup", {actionId: actionId}), {
|
||||
callback: function () {
|
||||
teaweb.success("保存成功", function () {
|
||||
teaweb.reload()
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
this.deleteAction = function (actionId) {
|
||||
let that = this
|
||||
teaweb.confirm("确定要删除此动作吗？", function () {
|
||||
that.$post(".delete")
|
||||
.params({
|
||||
actionId: actionId
|
||||
})
|
||||
.success(function () {
|
||||
teaweb.success("删除成功", function () {
|
||||
teaweb.reload()
|
||||
})
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
@@ -0,0 +1,97 @@
|
||||
{$layout "layout_popup"}
|
||||
|
||||
<h3>修改动作</h3>
|
||||
<form class="ui form" data-tea-action="$" data-tea-success="success">
|
||||
<input type="hidden" name="actionId" :value="action.id"/>
|
||||
<csrf-token></csrf-token>
|
||||
|
||||
<table class="ui table selectable definition">
|
||||
<tr>
|
||||
<td class="title">名称 *</td>
|
||||
<td>
|
||||
<input type="text" name="name" maxlength="50" ref="focus" v-model="action.name"/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>级别</td>
|
||||
<td>
|
||||
<firewall-event-level-options :v-value="eventLevel"></firewall-event-level-options>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>类型</td>
|
||||
<td>
|
||||
<select class="ui dropdown auto-width" name="type" v-model="type">
|
||||
<option value="">[请选择]</option>
|
||||
<option v-for="type in actionTypes" :value="type.code">{{type.name}}</option>
|
||||
</select>
|
||||
<p class="comment">{{typeDescription}}</p>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- IPSet -->
|
||||
<tbody v-if="type == 'ipset'">
|
||||
<tr>
|
||||
<td>IPSet白名单名称 *</td>
|
||||
<td>
|
||||
<input type="text" name="ipsetWhiteName" value="edge_white_list" maxlength="64" v-model="action.params.whiteName"/>
|
||||
<p class="comment">只能是英文、数字、下划线的组合。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>IPSet黑名单名称 *</td>
|
||||
<td>
|
||||
<input type="text" name="ipsetBlackName" value="edge_black_list" maxlength="64" v-model="action.params.blackName"/>
|
||||
<p class="comment">只能是英文、数字、下划线的组合。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>创建IPTables规则</td>
|
||||
<td>
|
||||
<checkbox name="ipsetAutoAddToIPTables" v-model="action.params.autoAddToIPTables"></checkbox>
|
||||
<p class="comment">是否尝试自动创建包含有此IPSet的IPTables规则。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>创建Firewalld规则</td>
|
||||
<td>
|
||||
<checkbox name="ipsetAutoAddToFirewalld" v-model="action.params.autoAddToFirewalld"></checkbox>
|
||||
<p class="comment">是否尝试自动创建包含有此IPSet的Firewalld规则。</p>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
|
||||
<!-- Firewalld -->
|
||||
<tbody v-if="type == 'firewalld'">
|
||||
|
||||
</tbody>
|
||||
|
||||
<!-- IPTables -->
|
||||
<tbody v-if="type == 'iptables'">
|
||||
|
||||
</tbody>
|
||||
|
||||
<!-- 脚本 -->
|
||||
<tbody v-if="type == 'script'">
|
||||
<tr>
|
||||
<td>脚本路径 *</td>
|
||||
<td>
|
||||
<input type="text" name="scriptPath" maxlength="200" v-model="action.params.path"/>
|
||||
<p class="comment">可执行脚本文件的完整路径。</p>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
|
||||
<!-- HTTP API -->
|
||||
<tbody v-if="type == 'httpAPI'">
|
||||
<tr>
|
||||
<td>API URL *</td>
|
||||
<td>
|
||||
<input type="text" name="httpAPIURL" maxlength="200" placeholder="http|https://..." v-model="action.params.url"/>
|
||||
<p class="comment">完整的API地址。</p>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<submit-btn></submit-btn>
|
||||
</form>
|
||||
@@ -0,0 +1,35 @@
|
||||
Tea.context(function () {
|
||||
this.$delay(function () {
|
||||
let that = this
|
||||
|
||||
// 类型
|
||||
this.$watch("type", function () {
|
||||
that.changeType()
|
||||
})
|
||||
|
||||
this.changeType()
|
||||
})
|
||||
|
||||
/**
|
||||
* 级别
|
||||
*/
|
||||
this.eventLevel = this.action.eventLevel
|
||||
|
||||
/**
|
||||
* 类型
|
||||
*/
|
||||
this.type = this.action.type
|
||||
this.typeDescription = ""
|
||||
|
||||
this.changeType = function () {
|
||||
let that = this
|
||||
let t = this.actionTypes.$find(function (k, v) {
|
||||
return v.code == that.type
|
||||
})
|
||||
if (t != null) {
|
||||
this.typeDescription = t.description
|
||||
} else {
|
||||
this.typeDescription = ""
|
||||
}
|
||||
}
|
||||
})
|
||||
Reference in New Issue
Block a user