{$layout}

{$template "waf_menu"}

<form method="post" class="ui form" data-tea-action="$" data-tea-success="success">
    <input type="hidden" name="firewallPolicyId" :value="firewallPolicyId"/>
    
    <div class="left-right-box-container">
        <div class="right-box">
            <!-- 基础设置 -->
            <div class="config-section">
                <div class="section-title">
                    <i class="icon settings"></i>
                    {{t('waf_update@基础设置')}}
                </div>

                <div class="config-item">
                    <div class="item-label">{{t('waf_update@策略名称_带星号')}}</div>
                    <div class="item-content">
                        <input type="text" name="name" maxlength="100" ref="focus" v-model="firewallPolicy.name"/>
                        <p class="comment">{{t('waf_update@策略名称提示')}}</p>
                    </div>
                </div>

                <div class="config-item">
                    <div class="item-label">{{t('waf_update@当前模式')}}</div>
                    <div class="item-content">
                        <b-select
                            name="mode"
                            v-model="firewallPolicy.mode"
                            auto-width
                            :options="[
                                ...modes.map(mode => ({
                                    label: mode.name,
                                    value: mode.code,
                                }))
                            ]"
                        ></b-select>
                        <p class="comment" v-for="mode in modes" v-if="mode.code == firewallPolicy.mode">{{mode.description}}</p>
                    </div>
                </div>

                <div class="config-item">
                    <div class="item-label">{{t('waf_update@启用预置的规则')}}</div>
                    <div class="item-content">
                        <template v-for="group in groups">
                            <checkbox style="width:10em;margin-bottom:0.5em" name="groupCodes" :v-value="group.code" v-model="group.isOn">
                                {{group.name}}
                            </checkbox>
                        </template>
                        <p class="comment">{{t('waf_update@预置规则组提示')}}</p>
                    </div>
                </div>
            </div>

            <!-- 动作配置 -->
            <div class="config-section">
                <div class="section-title">
                    <i class="icon lightning"></i>
                    {{t('waf_update@动作配置')}}
                </div>

                <div class="config-item">
                    <div class="item-label">{{t('waf_update@阻止动作配置')}}</div>
                    <div class="item-content">
                        <http-firewall-block-options :v-block-options="firewallPolicy.blockOptions"></http-firewall-block-options>
                    </div>
                </div>

                <div class="config-item">
                    <div class="item-label">{{t('waf_update@显示页面动作配置')}}</div>
                    <div class="item-content">
                        <http-firewall-page-options :v-page-options="firewallPolicy.pageOptions"></http-firewall-page-options>
                    </div>
                </div>

                <div class="config-item">
                    <div class="item-label">{{t('waf_update@人机识别动作配置')}}</div>
                    <div class="item-content">
                        <http-firewall-captcha-options :v-captcha-options="firewallPolicy.captchaOptions"></http-firewall-captcha-options>
                    </div>
                </div>

                <div class="config-item">
                    <div class="item-label">{{t('waf_update@JSCookie动作配置')}}</div>
                    <div class="item-content">
                        <http-firewall-js-cookie-options :v-js-cookie-options="firewallPolicy.jsCookieOptions"></http-firewall-js-cookie-options>
                    </div>
                </div>
            </div>

            <!-- 日志配置 -->
            <div class="config-section">
                <div class="section-title">
                    <i class="icon file text"></i>
                    {{t('waf_update@日志配置')}}
                </div>

                <div class="config-item" :class="{'color-border':firewallPolicy.log.isOn}">
                    <div class="item-label">{{t('waf_update@记录访问日志')}}</div>
                    <div class="item-content">
                        <input type="hidden" name="logJSON" :value="JSON.stringify(firewallPolicy.log)"/>
                        <checkbox name="" v-model="firewallPolicy.log.isOn"></checkbox>
                        <p class="comment">{{t('waf_update@记录访问日志提示')}}</p>
                    </div>
                </div>

                <div class="config-item" v-show="firewallPolicy.log.isOn">
                    <div class="item-label">{{t('waf_update@记录请求Body')}}</div>
                    <div class="item-content">
                        <checkbox v-model="firewallPolicy.log.requestBody"></checkbox>
                        <p class="comment">{{t('waf_update@记录请求Body提示')}}</p>
                    </div>
                </div>

                <div class="config-item" v-show="firewallPolicy.log.isOn">
                    <div class="item-label">{{t('waf_update@记录区域封禁日志')}}</div>
                    <div class="item-content">
                        <checkbox v-model="firewallPolicy.log.regionDenying"></checkbox>
                        <p class="comment">{{t('waf_update@记录区域封禁日志提示')}}</p>
                    </div>
                </div>
            </div>

            <!-- 区域封禁设置 -->
            <div class="config-section">
                <div class="section-title">
                    <i class="icon globe"></i>
                    {{t('waf_update@区域封禁设置')}}
                </div>

                <div class="config-item">
                    <div class="item-label">{{t('waf_update@区域封禁默认提示内容')}}</div>
                    <div class="item-content">
                        <textarea v-model="firewallPolicy.denyCountryHTML" name="denyCountryHTML" rows="3"></textarea>
                        <p class="comment">{{t('waf_update@区域封禁提示内容提示')}}</p>
                    </div>
                </div>

                <div class="config-item">
                    <div class="item-label">{{t('waf_update@省份封禁默认提示内容')}}</div>
                    <div class="item-content">
                        <textarea v-model="firewallPolicy.denyProvinceHTML" name="denyProvinceHTML" rows="3"></textarea>
                        <p class="comment">{{t('waf_update@省份封禁提示内容提示')}}</p>
                    </div>
                </div>
            </div>

            <!-- 其他配置 -->
            <div class="config-section">
                <div class="section-title">
                    <i class="icon cog"></i>
                    {{t('waf_update@其他配置')}}
                </div>

                <div class="config-item">
                    <div class="item-label">{{t('waf_update@使用系统防火墙')}}</div>
                    <div class="item-content">
                        <checkbox name="useLocalFirewall" :v-value="1" v-model="firewallPolicy.useLocalFirewall"></checkbox>
                        <p class="comment">{{t('waf_update@使用系统防火墙提示')}}</p>
                    </div>
                </div>

                <div class="config-item">
                    <div class="item-label">{{t('waf_update@SYNFlood防御')}}</div>
                    <div class="item-content">
                        <firewall-syn-flood-config-box :v-syn-flood-config="firewallPolicy.synFloodConfig"></firewall-syn-flood-config-box>
                    </div>
                </div>

                <div class="config-item">
                    <div class="item-label">{{t('waf_update@最多检查内容尺寸')}}</div>
                    <div class="item-content">
                        <input type="hidden" name="maxRequestBodySize" v-model="maxRequestBodySize"/>
                        <div class="ui input right labeled">
                            <input type="text" style="width: 10em" maxlength="10" v-model="firewallPolicy.maxRequestBodySize" @input="changeMaxRequestBodySize(firewallPolicy.maxRequestBodySize)"/>
                            <span class="ui label">{{t('waf_update@字节')}}</span>
                        </div>
                        <p class="comment"><span v-if="maxRequestBodySize > 0">{{t('waf_update@当前：')}}{{maxRequestBodySizeFormat}}。</span>{{t('waf_update@最大检查内容尺寸提示')}}</p>
                    </div>
                </div>

                <div class="config-item">
                    <div class="item-label">{{t('waf_update@描述')}}</div>
                    <div class="item-content">
                        <textarea name="description" rows="3" v-model="firewallPolicy.description"></textarea>
                    </div>
                </div>

                <div class="config-item">
                    <div class="item-label">{{t('waf_update@启用当前策略')}}</div>
                    <div class="item-content">
                        <checkbox name="isOn" :v-value="1" v-model="firewallPolicy.isOn"/>
                    </div>
                </div>
            </div>

            <div class="margin"></div>
            <submit-btn></submit-btn>
        </div>
    </div>
</form>