{$layout}

{$template "../waf_menu"}
{$template "menu"}

<form method="post" class="ui form" data-tea-action="$" data-tea-success="success">
    <input type="hidden" name="firewallPolicyId" :value="firewallPolicyId" />
    <input type="hidden" name="exceptURLPatternsJSON" :value="JSON.stringify(exceptURLPatterns)" />
    <input type="hidden" name="onlyURLPatternsJSON" :value="JSON.stringify(onlyURLPatterns)" />

    <div class="left-right-box-container">
        <div class="right-box">
            <!-- 运营商设置 -->
            <div class="config-section">
                <div class="section-title">
                    <i class="icon building"></i>
                    {{t('providers@运营商设置')}}
                </div>

                <div class="config-item">
                    <div class="item-label">{{t('providers@仅允许的运营商')}}</div>
                    <div class="item-content">
                        <http-firewall-provider-selector :v-providers="allowedProviders" :v-type="'allow'"
                            @change="changeAllowedProviders"></http-firewall-provider-selector>
                    </div>
                </div>

                <div class="config-item">
                    <div class="item-label">{{t('providers@仅封禁的运营商')}}</div>
                    <div class="item-content">
                        <p class="comment" v-if="allowedProviders.length > 0">{{t('providers@已设置允许运营商提示')}}</p>
                        <http-firewall-provider-selector :v-providers="deniedProviders" :v-type="'deny'"
                            v-show="allowedProviders.length == 0"></http-firewall-provider-selector>
                    </div>
                </div>
            </div>

            <!-- 更多选项 -->
            <div class="config-section">
                <div class="section-title">
                    <i class="icon cog"></i>
                    {{t('providers@更多选项')}}
                </div>

                <div class="config-item">
                    <div class="item-label">
                        {{t('providers@例外URL')}}
                        <tip-icon :content="t('providers@例外URL提示')"></tip-icon>
                    </div>
                    <div class="item-content">
                        <url-patterns-box v-model="exceptURLPatterns"></url-patterns-box>
                    </div>
                </div>

                <div class="config-item">
                    <div class="item-label">
                        {{t('providers@限制URL')}}
                        <tip-icon :content="t('providers@限制URL提示')"></tip-icon>
                    </div>
                    <div class="item-content">
                        <url-patterns-box v-model="onlyURLPatterns"></url-patterns-box>
                    </div>
                </div>

                <div class="config-item">
                    <div class="item-label">{{t('providers@提示内容')}}</div>
                    <div class="item-content">
                        <textarea v-model="providerHTML" name="providerHTML" rows="3"></textarea>
                        <p class="comment">{{t('providers@提示内容说明')}}</p>
                    </div>
                </div>
            </div>
            <div class="margin"></div>
            <submit-btn></submit-btn>
        </div>
    </div>
</form>