{$layout}
{$template "../menu"}
{$template "/left_menu_with_menu"}

<div class="left-right-box-container">

    <div class="right-box">
        <form class="ui form" method="post" data-tea-action="$" data-tea-success="success">
            <csrf-token></csrf-token>
            <input type="hidden" name="clusterId" :value="clusterId"/>
            <div class="config-section">
                 <div class="section-title">{{t('cc_index@CC防护设置')}}</div>
                 <div class="config-item" v-show="!isGlobal">
                    <div class="item-label">{{t('cc_index@使用全局配置')}}</div>
                    <div class="item-content">
                        <p-switch name="useGlobal" v-model="useGlobal"></p-switch>
                        <p class="comment">{{t('cc_index@确定当前配置是否使用全局集群配置勾选表面当前使用全局配置否则使用自定义配置')}}</p>
                    </div>
                </div>
                <div class="config-item">
                    <div class="item-content">
                        <checkbox name="isOn" :v-value="1" v-model="httpCCPolicy.isOn">{{t('cc_index@启用CC防护功能')}}</checkbox>
                        <p class="comment">{{t('cc_index@选中后表示当前集群下的网站可以使用CC防护功能')}}</p>
                    </div>
                </div>
                
                <div v-show="httpCCPolicy.isOn">
                    <div class="config-item" v-for="(defaultThreshold, index) in defaultThresholds" :key="index">
                        <div class="item-label">{{t('cc_index@检测阈值')}}{{index+1}}</div>
                        <div class="item-content">
                             <div class="config-item nested-item">
                                <div class="item-label">{{t('cc_index@计算周期')}}</div>
                                <div class="item-content">
                                    <div class="ui input right labeled">
                                        <input type="text" name="thresholdPeriodSeconds" style="width: 5em" maxlength="4" v-model="thresholds[index].periodSeconds"/>
                                        <span class="ui label">{{t('cc_index@秒')}}</span>
                                    </div>
                                    <p class="comment">{{t('cc_index@0表示默认默认')}}{{defaultThreshold.periodSeconds}}{{t('cc_index@秒')}}</p>
                                </div>
                            </div>
                             <div class="config-item nested-item">
                                <div class="item-label">{{t('cc_index@最大请求数')}}</div>
                                <div class="item-content">
                                    <input type="text" name="thresholdMaxRequests" style="width: 6em" maxlength="5" v-model="thresholds[index].maxRequests"/>
                                    <p class="comment">{{t('cc_index@0表示默认默认')}}{{defaultThreshold.maxRequests}}。</p>
                                </div>
                            </div>
                            <div class="config-item nested-item">
                                <div class="item-label">{{t('cc_index@拦截时间')}}</div>
                                <div class="item-content">
                                    <div class="ui input right labeled">
                                        <input type="text" name="thresholdBlockSeconds" style="width: 5em" maxlength="4" v-model="thresholds[index].blockSeconds"/>
                                        <span class="ui label">{{t('cc_index@秒')}}</span>
                                    </div>
                                    <p class="comment">{{t('cc_index@0表示默认默认')}}{{defaultThreshold.blockSeconds}}{{t('cc_index@秒')}}</p>
                                </div>
                            </div>
                            <p class="comment"><pro-warning-label></pro-warning-label></p>
                        </div>
                    </div>
                    <div class="config-item">
                        <div class="item-label">{{t('cc_index@单IP最大并发连接数')}}</div>
                        <div class="item-content">
                            <input type="text" name="maxConnectionsPerIP" v-model="httpCCPolicy.maxConnectionsPerIP" maxlength="6" style="width: 6em"/>
                            <p class="comment">{{t('cc_index@如果为0表示使用默认默认为')}}{{defaultHTTPCCPolicyMaxConnectionsPerIP}}。<pro-warning-label></pro-warning-label></p>
                        </div>
                    </div>
                    <div class="config-item">
                        <div class="item-label">{{t('cc_index@跳转检测路径')}}</div>
                        <div class="item-content">
                            <input type="text" name="redirectsCheckingValidatePath" v-model="httpCCPolicy.redirectsChecking.validatePath"/>
                            <p class="comment">{{t('cc_index@如果不填表示使用默认默认为')}}{{defaultHTTPCCPolicyRedirectsCheckingValidatePath}}{{t('cc_index@必须是一个特殊的URL以避免用户访问异常')}}<pro-warning-label></pro-warning-label></p>
                        </div>
                    </div>
                    <div class="config-item">
                        <div class="item-label">{{t('cc_index@跳转检测周期')}}</div>
                        <div class="item-content">
                            <div class="ui input right labeled">
                                <input type="text" maxlength="4" style="width: 5em" name="redirectsCheckingDurationSeconds" v-model="httpCCPolicy.redirectsChecking.durationSeconds"/>
                                <span class="ui label">{{t('cc_index@秒')}}</span>
                            </div>
                            <p class="comment">{{t('cc_index@如果为0表示使用默认默认为')}}{{defaultHTTPCCPolicyRedirectsCheckingDurationSeconds}}。<pro-warning-label></pro-warning-label></p>
                        </div>
                    </div>
                    <div class="config-item">
                        <div class="item-label">{{t('cc_index@跳转检测最多次数')}}</div>
                        <div class="item-content">
                            <input type="text" maxlength="4" style="width: 5em" name="redirectsCheckingMaxRedirects" v-model="httpCCPolicy.redirectsChecking.maxRedirects"/>
                            <p class="comment">{{t('cc_index@如果为0表示使用默认默认为')}}{{defaultHTTPCCPolicyRedirectsCheckingMaxRedirects}}。<pro-warning-label></pro-warning-label></p>
                        </div>
                    </div>
                    <div class="config-item">
                        <div class="item-label">{{t('cc_index@跳转检测拦截时间')}}</div>
                        <div class="item-content">
                            <div class="ui input right labeled">
                                <input type="text" maxlength="6" style="width: 6em" name="redirectsCheckingBlockSeconds" v-model="httpCCPolicy.redirectsChecking.blockSeconds"/>
                                <span class="ui label">{{t('cc_index@秒')}}</span>
                            </div>
                            <p class="comment">{{t('cc_index@如果为0表示使用默认默认为')}}{{defaultHTTPCCPolicyRedirectsCheckingBlockSeconds}}。<pro-warning-label></pro-warning-label></p>
                        </div>
                    </div>
                    <div class="config-item">
                        <div class="item-label">{{t('cc_index@防火墙拦截范围')}}</div>
                        <div class="item-content">
                            <b-select
                                name="firewallScope"
                                v-model="httpCCPolicy.firewall.scope"
                                auto-width
                                :options="[
                                    {label: t('cc_index@所有网站'), value: 'global'},
                                    {label: t('cc_index@当前网站'), value: 'service'},
                                ]"
                            ></b-select>
                            <p class="comment" v-if="httpCCPolicy.firewall.scope == 'global'">{{t('cc_index@所有网站表示IP被拦截时将被阻止访问所有网站此时系统可以自动尝试利用本地防火墙提升拦截效率')}}</p>
                            <p class="comment" v-if="httpCCPolicy.firewall.scope == 'service'">{{t('cc_index@当前网站表示IP被拦截时只会阻止访问当前网站选择此选项会严重影响拦截效率建议只有特殊情况下才使用')}}</p>
                        </div>
                    </div>
                </div>
            </div>
            <submit-btn></submit-btn>
        </form>
    </div>
</div>