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

{$var "header"}
<link rel="stylesheet" href="ipadmin.css" type="text/css"/>
{$end}

<div class="left-right-box-container">
    <div class="right-box">
        {$template "../menu"}

        <warning-message v-if="!featureIsOn">{{t('ipadmin_test@尚未开通功能')}}</warning-message>

        {$ if .featureIsOn}
        <warning-message v-if="!wafIsOn" v-html="t('ipadmin_test@waf未启用提示')"></warning-message>

        <form method="post" class="ui form base-form config-section" data-tea-action="$" data-tea-success="success">
            <input type="hidden" name="firewallPolicyId" :value="firewallPolicyId"/>
            <div class="section-title">
                <i class="pi pi-server"></i>
                {{t('ipadmin_test@测试IP')}}
            </div>
            <div class="config-item">
                <div class="item-label">{{t('ipadmin_test@IP*')}}</div>
                <div class="item-content">
                    <input type="text" name="ip" maxlength="40" ref="focus" v-model="ip"/>
                    <p class="comment">{{t('ipadmin_test@要检查的IP')}}</p>
                </div>
            </div>
            <div class="config-item">
                <submit-btn>{{t('ipadmin_test@检查IP状态')}}</submit-btn>
            </div>
        </form>

        <div v-if="result != null">
            <div class="config-item">
                <div class="item-label">{{t('ipadmin_test@检查结果')}}</div>
                <div class="item-content">
                    <div v-if="result.isDone">
                        <div v-if="!result.isOk">
                            <span class="red">{{result.error}}</span>
                        </div>
                        <div v-if="result.isFound">
                            <div v-if="result.item != null">
                                <div v-if="result.isAllowed">
                                    <span class="green" v-if="result.item.listType == 'white'" v-html="t('ipadmin_test@在白名单中')"></span><ip-item-text :v-item="result.item"></ip-item-text>&nbsp;<a href="" @click.prevent="updateItem(result.list.id, result.item.id)" :title="t('ipadmin_test@查看和修改')"><i class="icon pencil small"></i></a>
                                    <span class="grey" v-if="result.item.listType == 'grey'" v-html="t('ipadmin_test@在灰名单中')"></span><ip-item-text :v-item="result.item"></ip-item-text>&nbsp;<a href="" @click.prevent="updateItem(result.list.id, result.item.id)" :title="t('ipadmin_test@查看和修改')"><i class="icon pencil small"></i></a>
                                </div>
                                <div v-else>
                                    <span class="red" v-html="t('ipadmin_test@在黑名单中')"></span><ip-item-text :v-item="result.item"></ip-item-text>&nbsp;<a href="" @click.prevent="updateItem(result.list.id, result.item.id)" :title="t('ipadmin_test@查看和修改')"><i class="icon pencil small"></i></a>
                                </div>
                            </div>
                            <div v-if="result.province != null">
                                <span class="red" v-html="t('ipadmin_test@在省份封禁中', [result.province.name])"></span>
                            </div>
                            <div v-if="result.country != null && result.province == null">
                                <span class="red" v-html="t('ipadmin_test@在国家地区封禁中', [result.country.name])"></span>
                            </div>
                        </div>
                        <div v-if="!result.isFound">
                            {{t('ipadmin_test@未找到匹配配置', [ip])}}
                        </div>
                    </div>
                </div>
            </div>
        </div>
        {$end}
    </div>
</div>