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

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

    <div class="right-box">
        {$template "menu"}

        <div class="margin"></div>
        <div v-show="webConfig.cache == null || !webConfig.cache.isOn">
            <p class="comment">{{t('cache_purge@没有开启缓存不需要刷新')}}</p>
        </div>
        <div v-show="webConfig.cache != null && webConfig.cache.isOn">
            <p class="comment">{{t('cache_purge@可以在这里批量刷新一组URL缓存')}}</p>

            <form method="post" class="ui form" data-tea-action="$" data-tea-before="before" data-tea-success="success" data-tea-fail="fail" data-tea-done="done" data-tea-timeout="300">
                <input type="hidden" name="serverId" :value="serverId"/>
                <input type="hidden" name="webId" :value="webId"/>
                <div class="config-section">
                    <div class="section-title">
                        <i class="pi pi-server"></i>
                        {{t('cache_purge@刷新缓存')}}
                    </div>
                    <div class="config-item">
                        <div class="item-label">{{t('cache_purge@URL类型')}}</div>
                        <div class="item-content">
                            <radio name="keyType" :v-value="'key'" v-model="keyType">{{t('cache_purge@URL')}}</radio> &nbsp;
                            <radio name="keyType" :v-value="'prefix'" v-model="keyType">{{t('cache_purge@目录')}}</radio>
                        </div>
                    </div>
                    <div class="config-item">
                        <div class="item-label">
                            <span v-if="keyType == 'key'">{{t('cache_purge@URL')}}</span>
                            <span v-if="keyType == 'prefix'">{{t('cache_purge@目录')}}</span>
                        </div>
                        <div class="item-content">
                            <textarea name="keys" rows="10" ref="keysBox"></textarea>
                            <p class="comment" v-if="keyType == 'key'">{{t('cache_purge@每行一个URL比如_example_com_hello_world_html')}}<code-label>https://example.com/hello/world.html</code-label>。</p>
                            <p class="comment" v-if="keyType == 'prefix'">{{t('cache_purge@每行一个URL目录比如_example_com_hello_如果只填写域名部分表示清理全站比如_example_com')}}<code-label>https://example.com/</code-label>;{{t('cache_purge@如果只填写域名部分表示清理全站比如_example_com')}}<code-label>example.com</code-label>。</p>
                        </div>
                    </div>
                    <div class="config-item">
                        <div class="item-label">{{t('cache_purge@操作结果')}}</div>
                        <div class="item-content">
                            <div v-if="isRequesting">{{t('cache_purge@数据发送中')}}</div>
                            <span class="red" v-if="!isRequesting && !isOk && message.length > 0">{{t('cache_purge@失败')}}{{message}}</span>
                            <div v-if="!isRequesting && !isOk && failKeys.length > 0" class="fail-keys-box">
                                <div v-for="failKey in failKeys" :key="failKey.key">
                                    <span class="red">{{failKey.key}}: {{failKey.reason}}</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <submit-btn v-if="!isRequesting">{{t('cache_purge@提交')}}</submit-btn>
            </form>
        </div>
    </div>
</div>