{$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">
                    <i class="pi pi-shield"></i>
                    {{t('clusters_cluster_settings_uam_index@5秒盾设置')}}
                </div>
                 <div class="config-item" v-show="!isGlobal">
                    <div class="item-label">{{t('clusters_cluster_settings_uam_index@使用全局配置')}}</div>
                    <div class="item-content">
                        <p-switch name="useGlobal" v-model="useGlobal"></p-switch>
                        <p class="comment">{{t('clusters_cluster_settings_uam_index@确定当前配置是否使用全局集群配置')}}</p>
                    </div>
                </div>
                <div class="config-item">
                    <div class="item-label">{{t('clusters_cluster_settings_uam_index@启用5秒盾功能')}}</div>
                    <div class="item-content">
                        <p-switch name="isOn" :v-value="1" v-model="uamPolicy.isOn"></p-switch>
                        <p class="comment">{{t('clusters_cluster_settings_uam_index@选中后表示当前集群下的网站可以使用5秒盾功能')}}</p>
                    </div>
                </div>
                
                <div v-show="uamPolicy.isOn">
                    <div class="config-item">
                        <div class="item-label">{{t('clusters_cluster_settings_uam_index@验证有效期')}}</div>
                        <div class="item-content">
                            <div class="ui input right labeled">
                                <input type="text" name="keyLife" v-model="uamPolicy.keyLife" maxlength="6" size="6" style="width: 6em"/>
                                <span class="ui label">{{t('clusters_cluster_settings_uam_index@秒')}}</span>
                            </div>
                            <p class="comment">{{t('clusters_cluster_settings_uam_index@单个客户端验证通过后')}}</p>
                        </div>
                    </div>
                    <div class="config-item">
                        <div class="item-label">{{t('clusters_cluster_settings_uam_index@拦截时长')}}</div>
                        <div class="item-content">
                            <div class="ui input right labeled">
                                <input type="text" name="blockSeconds" v-model="uamPolicy.blockSeconds" maxlength="6" size="6" style="width: 6em"/>
                                <span class="ui label">{{t('clusters_cluster_settings_uam_index@秒')}}</span>
                            </div>
                            <p class="comment">{{t('clusters_cluster_settings_uam_index@验证失败后系统拦截的时间')}}</p>
                        </div>
                    </div>
                    <div class="config-item">
                        <div class="item-label">{{t('clusters_cluster_settings_uam_index@最大失败次数')}}</div>
                        <div class="item-content">
                            <div class="ui input right labeled">
                                <input type="text" name="maxFails" v-model="uamPolicy.maxFails" maxlength="6" size="6" style="width: 6em"/>
                                <span class="ui label">{{t('clusters_cluster_settings_uam_index@次')}}</span>
                            </div>
                            <p class="comment">{{t('clusters_cluster_settings_uam_index@失败尝试达到此数字后则认为验证失败')}}</p>
                        </div>
                    </div>
                    <div class="config-item">
                        <div class="item-label">{{t('clusters_cluster_settings_uam_index@页面标题')}}</div>
                        <div class="item-content">
                            <input type="text" maxlength="200" name="uiTitle" v-model="uamPolicy.uiTitle"/>
                            <p class="comment">{{t('clusters_cluster_settings_uam_index@提示页面的标题')}}</p>
                        </div>
                    </div>
                    <div class="config-item">
                        <div class="item-label">{{t('clusters_cluster_settings_uam_index@页面提示内容')}}</div>
                        <div class="item-content">
                            <textarea rows="8" name="uiBody" v-model="uamPolicy.uiBody"></textarea>
                            <p class="comment">{{t('clusters_cluster_settings_uam_index@提示页面的HTML内容_1')}}<code-label>${host}</code-label>{{t('clusters_cluster_settings_uam_index@提示页面的HTML内容_2')}}<code-label>${product.name}</code-label>{{t('clusters_cluster_settings_uam_index@提示页面的HTML内容_3')}}<code-label>&lt;span class=&quot;ui-counter&quot;&gt;5&lt;/span&gt;</code-label>{{t('clusters_cluster_settings_uam_index@提示页面的HTML内容_4')}}<a href="" @click.prevent="setTemplateBody">{{t('clusters_cluster_settings_uam_index@使用模板')}}</a></p>
                        </div>
                    </div>
                </div>
                
                <div class="config-item" v-if="uamPolicy.isOn">
                     <div class="item-content"><more-options-indicator></more-options-indicator></div>
                </div>
                
                <div v-show="moreOptionsVisible">
                     <div class="config-item">
                        <div class="item-content">
                            <checkbox name="allowSearchEngines" :v-value="1" v-model="uamPolicy.allowSearchEngines">{{t('clusters_cluster_settings_uam_index@允许常见的搜索引擎')}}</checkbox>
                            <p class="comment">{{t('clusters_cluster_settings_uam_index@选中表示允许GoogleBing等常见搜索引擎直接跳过检查')}}</p>
                        </div>
                    </div>
                    <div class="config-item">
                        <div class="item-content">
                            <checkbox name="denySpiders" :v-value="1" v-model="uamPolicy.denySpiders">{{t('clusters_cluster_settings_uam_index@拦截常见爬虫')}}</checkbox>
                            <p class="comment">{{t('clusters_cluster_settings_uam_index@选中表示自动拦截PythonScrapy等常见爬虫')}}</p>
                        </div>
                    </div>
                    <div class="config-item">
                        <div class="item-content">
                            <checkbox name="includeSubdomains" :v-value="1" v-model="uamPolicy.includeSubdomains">{{t('clusters_cluster_settings_uam_index@包含子域名')}}</checkbox>
                            <p class="comment">{{t('clusters_cluster_settings_uam_index@选中后表示子域名之间只需验证一次')}}</p>
                        </div>
                    </div>
                    <div class="config-item">
                        <div class="item-label">{{t('clusters_cluster_settings_uam_index@防火墙拦截范围')}}</div>
                        <div class="item-content">
                            <b-select
                                name="firewallScope"
                                v-model="uamPolicy.firewall.scope"
                                auto-width
                                :options="[
                                    {label: t('clusters_cluster_settings_uam_index@所有网站'), value: 'global'},
                                    {label: t('clusters_cluster_settings_uam_index@当前网站'), value: 'service'},
                                ]"
                            ></b-select>
                            <p class="comment" v-if="uamPolicy.firewall.scope == 'global'">{{t('clusters_cluster_settings_uam_index@所有网站表示IP被拦截时')}}</p>
                            <p class="comment" v-if="uamPolicy.firewall.scope == 'service'">{{t('clusters_cluster_settings_uam_index@当前网站表示IP被拦截时')}}</p>
                        </div>
                    </div>
                </div>
            </div>
            <submit-btn></submit-btn>
        </form>
    </div>
</div>