WAF策略增加显示页面动作默认设置

web/views/@default/servers/components/waf/policy.html

@@ -26,12 +26,22 @@
            </div>
         </td>
     </tr>
+</table>
+
+<h4>动作配置</h4>
+<table class="ui table definition selectable">
     <tr>
-        <td>阻止动作设置</td>
+        <td class="title">阻止动作设置</td>
         <td>
            <http-firewall-block-options-viewer :v-block-options="firewallPolicy.blockOptions"></http-firewall-block-options-viewer>
         </td>
     </tr>
+    <tr>
+        <td class="title">显示页面动作设置</td>
+        <td>
+            <http-firewall-page-options-viewer :v-page-options="firewallPolicy.pageOptions"></http-firewall-page-options-viewer>
+        </td>
+    </tr>
     <tr>
         <td>人机识别动作配置</td>
         <td>
@@ -46,15 +56,12 @@
             <p class="comment" v-if="firewallPolicy.useLocalFirewall">可以在合适的时候自动使用系统自带防火墙进行防御。</p>
         </td>
     </tr>
+</table>
+
+<h4>日志配置</h4>
+<table class="ui table definition selectable">
     <tr>
-        <td>SYN Flood防御</td>
-        <td>
-            <span v-if="firewallPolicy.synFlood == null || !firewallPolicy.synFlood.isOn" class="disabled">未启用</span>
-            <firewall-syn-flood-config-viewer v-else :v-syn-flood-config="firewallPolicy.synFlood"></firewall-syn-flood-config-viewer>
-        </td>
-    </tr>
-    <tr>
-        <td :class="{'color-border':firewallPolicy.log !=null && firewallPolicy.log.isOn}">记录访问日志</td>
+        <td class="title" :class="{'color-border':firewallPolicy.log !=null && firewallPolicy.log.isOn}">记录访问日志</td>
         <td>
             <span v-if="firewallPolicy.log == null || !firewallPolicy.log.isOn">默认</span>
             <span v-else class="green">开启</span>
@@ -74,15 +81,12 @@
             <span v-else>不记录</span>
         </td>
     </tr>
+</table>
+
+<h4>区域封禁设置</h4>
+<table class="ui table definition selectable">
     <tr>
-        <td>最多检查内容尺寸</td>
-        <td>
-            <span v-if="firewallPolicy.maxRequestBodySize == 0" class="disabled">使用默认</span>
-            <span v-else>{{firewallPolicy.maxRequestBodySizeFormat}}</span>
-        </td>
-    </tr>
-    <tr>
-        <td>区域封禁默认提示内容</td>
+        <td class="title">区域封禁默认提示内容</td>
         <td>
             <span v-if="firewallPolicy.denyCountryHTML != null && firewallPolicy.denyCountryHTML.length > 0">自定义</span>
             <span v-else class="disabled">使用默认</span>
@@ -95,6 +99,24 @@
             <span v-else class="disabled">使用默认</span>
         </td>
     </tr>
+</table>
+
+<h4>其他配置</h4>
+<table class="ui table definition selectable">
+    <tr>
+        <td class="title">SYN Flood防御</td>
+        <td>
+            <span v-if="firewallPolicy.synFlood == null || !firewallPolicy.synFlood.isOn" class="disabled">未启用</span>
+            <firewall-syn-flood-config-viewer v-else :v-syn-flood-config="firewallPolicy.synFlood"></firewall-syn-flood-config-viewer>
+        </td>
+    </tr>
+    <tr>
+        <td>最多检查内容尺寸</td>
+        <td>
+            <span v-if="firewallPolicy.maxRequestBodySize == 0" class="disabled">使用默认</span>
+            <span v-else>{{firewallPolicy.maxRequestBodySizeFormat}}</span>
+        </td>
+    </tr>
     <tr>
         <td>描述</td>
         <td>

web/views/@default/servers/components/waf/update.html

@@ -31,27 +31,84 @@
                 <p class="comment">可以启用一些我们预置的规则组。</p>
             </td>
         </tr>
-        <tr>
-            <td colspan="2"><more-options-indicator></more-options-indicator></td>
-        </tr>
-        <tbody v-show="moreOptionsVisible">
+    </table>
+
+    <h4>动作配置</h4>
+    <table class="ui table definition selectable">
+        <tbody>
             <tr>
-                <td>阻止动作配置</td>
+                <td class="title">阻止动作配置</td>
                 <td>
                     <http-firewall-block-options :v-block-options="firewallPolicy.blockOptions"></http-firewall-block-options>
                 </td>
             </tr>
+            <tr>
+                <td>显示页面动作配置</td>
+                <td>
+                    <http-firewall-page-options :v-page-options="firewallPolicy.pageOptions"></http-firewall-page-options>
+                </td>
+            </tr>
             <tr>
                 <td>人机识别动作配置</td>
                 <td>
                     <http-firewall-captcha-options :v-captcha-options="firewallPolicy.captchaOptions"></http-firewall-captcha-options>
                 </td>
             </tr>
+        </tbody>
+    </table>
+
+    <h4>日志配置</h4>
+    <table class="ui table definition selectable">
+        <tr>
+            <td class="title" :class="{'color-border':firewallPolicy.log.isOn}">记录访问日志</td>
+            <td>
+                <input type="hidden" name="logJSON" :value="JSON.stringify(firewallPolicy.log)"/>
+                <checkbox name="" v-model="firewallPolicy.log.isOn"></checkbox>
+                <p class="comment">选中后，总是记录WAF相关访问日志，即使服务中没有开启访问日志。</p>
+            </td>
+        </tr>
+        <tr v-show="firewallPolicy.log.isOn">
+            <td class="color-border">记录请求Body</td>
+            <td>
+                <checkbox v-model="firewallPolicy.log.requestBody"></checkbox>
+                <p class="comment">选中后，表示在访问日志中记录匹配的请求内容。注意：此选项会明显增加访问日志占用空间，请谨慎开启。</p>
+            </td>
+        </tr>
+        <tr v-show="firewallPolicy.log.isOn">
+            <td class="color-border">记录区域封禁日志</td>
+            <td>
+                <checkbox v-model="firewallPolicy.log.regionDenying"></checkbox>
+                <p class="comment">选中后，表示在访问日志中记录区域封禁（地区和省份）事件。</p>
+            </td>
+        </tr>
+    </table>
+
+    <h4>区域封禁设置</h4>
+    <table class="ui table definition selectable">
+        <tr>
+            <td class="title">区域封禁默认提示内容</td>
+            <td>
+                <textarea v-model="firewallPolicy.denyCountryHTML" name="denyCountryHTML" rows="3"></textarea>
+                <p class="comment">当客户端所在区域被封禁时提示页面的HTML内容；不填则表示使用默认的提示内容；支持请求变量。</p>
+            </td>
+        </tr>
+        <tr>
+            <td>省份封禁默认提示内容</td>
+            <td>
+                <textarea v-model="firewallPolicy.denyProvinceHTML" name="denyProvinceHTML" rows="3"></textarea>
+                <p class="comment">当客户端所在省份被封禁时提示页面的HTML内容；不填则表示使用默认的提示内容；支持请求变量。</p>
+            </td>
+        </tr>
+    </table>
+
+    <h4>其他配置</h4>
+    <table class="ui table definition selectable">
+        <tbody>
             <tr>
-                <td>使用系统防火墙</td>
+                <td class="title">使用系统防火墙</td>
                 <td>
                     <checkbox name="useLocalFirewall" v-model="firewallPolicy.useLocalFirewall"></checkbox>
-                    <p class="comment">开启后，可以在合适的时候自动使用系统自带防火墙进行防御。</p>
+                    <p class="comment">开启后，可以在合适的时候自动使用系统自带防火墙进行防御；建议在每个边缘节点都安装nftables以提升封禁性能。</p>
                 </td>
             </tr>
             <tr>
@@ -60,28 +117,6 @@
                     <firewall-syn-flood-config-box :v-syn-flood-config="firewallPolicy.synFloodConfig"></firewall-syn-flood-config-box>
                 </td>
             </tr>
-            <tr>
-                <td :class="{'color-border':firewallPolicy.log.isOn}">记录访问日志</td>
-                <td>
-                    <input type="hidden" name="logJSON" :value="JSON.stringify(firewallPolicy.log)"/>
-                    <checkbox name="" v-model="firewallPolicy.log.isOn"></checkbox>
-                    <p class="comment">选中后，总是记录WAF相关访问日志，即使服务中没有开启访问日志。</p>
-                </td>
-            </tr>
-            <tr v-show="firewallPolicy.log.isOn">
-                <td class="color-border">记录请求Body</td>
-                <td>
-                    <checkbox v-model="firewallPolicy.log.requestBody"></checkbox>
-                    <p class="comment">选中后，表示在访问日志中记录匹配的请求内容。注意：此选项会明显增加访问日志占用空间，请谨慎开启。</p>
-                </td>
-            </tr>
-            <tr v-show="firewallPolicy.log.isOn">
-                <td class="color-border">记录区域封禁日志</td>
-                <td>
-                    <checkbox v-model="firewallPolicy.log.regionDenying"></checkbox>
-                    <p class="comment">选中后，表示在访问日志中记录区域封禁（地区和省份）事件。</p>
-                </td>
-            </tr>
             <tr>
                 <td>最多检查内容尺寸</td>
                 <td>
@@ -93,20 +128,6 @@
                     <p class="comment"><span v-if="maxRequestBodySize > 0">当前：{{maxRequestBodySizeFormat}}。</span>WAF能够分析的最大文件内容尺寸，0表示默认，默认为512K；此值越大，对应使用的系统内存越多，除非特殊情况，否则请谨慎修改。</p>
                 </td>
             </tr>
-            <tr>
-                <td>区域封禁默认提示内容</td>
-                <td>
-                    <textarea v-model="firewallPolicy.denyCountryHTML" name="denyCountryHTML" rows="3"></textarea>
-                    <p class="comment">当客户端所在区域被封禁时提示页面的HTML内容；不填则表示使用默认的提示内容；支持请求变量。</p>
-                </td>
-            </tr>
-            <tr>
-                <td>省份封禁默认提示内容</td>
-                <td>
-                    <textarea v-model="firewallPolicy.denyProvinceHTML" name="denyProvinceHTML" rows="3"></textarea>
-                    <p class="comment">当客户端所在省份被封禁时提示页面的HTML内容；不填则表示使用默认的提示内容；支持请求变量。</p>
-                </td>
-            </tr>
             <tr>
                 <td>描述</td>
                 <td>
@@ -124,5 +145,6 @@
             </tr>
         </tbody>
     </table>
+
     <submit-btn></submit-btn>
 </form>