{$layout}
{$template "policy_menu"}

<div class="cache-config-container">
    <div class="cache-config-form">
        <div class="form-title">
            <i class="icon info circle"></i> {{t('cache_policy@策略详情')}}
        </div>

        <div class="config-section">
            <div class="section-title">
                <i class="icon settings"></i> {{t('cache_policy@基本信息')}}
            </div>

            <div class="config-item">
                <div class="item-label">{{t('cache_index_js@策略名称')}}</div>
                <div class="item-content">{{cachePolicy.name}}</div>
            </div>

            <div class="config-item">
                <div class="item-label">{{t('certs_index@状态')}}</div>
                <div class="item-content"><label-on :v-is-on="cachePolicy.isOn"></label-on></div>
            </div>

            <div class="config-item">
                <div class="item-label">{{t('cache_createPopup_html@缓存类型')}}</div>
                <div class="item-content">
                    {{typeName}}<span class="small">（{{cachePolicy.type}}）</span>
                </div>
            </div>
        </div>

        <!-- {{t('cache_createPopup_html@文件缓存选项')}} -->
        <div class="config-section" v-if="cachePolicy.type == 'file'">
            <div class="section-title">
                <i class="icon hdd"></i> {{t('cache_policy@文件缓存配置')}}
            </div>

            <div class="config-item">
                <div class="item-label">{{t('cache_createPopup_html@缓存目录')}}</div>
                <div class="item-content">
                    {{cachePolicy.options.dir}}
                    <p class="comment">{{t('cache_createPopup_html@缓存目录提示')}}</p>
                </div>
            </div>

            <div class="config-item">
                <div class="item-label">{{t('cache_createPopup_html@缓存硬盘最大用量')}}</div>
                <div class="item-content">
                    <size-capacity-view :v-value="cachePolicy.capacity" :v-default-text="t('cache_index_html@不限')"></size-capacity-view>
                    <p class="comment">{{t('cache_policy@缓存硬盘最大用量提示')}}</p>
                </div>
            </div>

            <div class="config-item"
                v-if="cachePolicy.options.memoryPolicy != null && cachePolicy.options.memoryPolicy.capacity != null && cachePolicy.options.memoryPolicy.capacity.count > 0">
                <div class="item-label">{{t('cache_createPopup_html@内存最大容量')}}</div>
                <div class="item-content">
                    <size-capacity-view :v-value="cachePolicy.options.memoryPolicy.capacity"></size-capacity-view>
                    <p class="comment">{{t('cache_policy@文件缓存内存最大容量提示')}}</p>
                </div>
            </div>

            <div class="config-item" v-else>
                <div class="item-label">{{t('cache_createPopup_html@内存最大容量')}}</div>
                <div class="item-content">
                    <a :href="Tea.url('.update', {cachePolicyId:cachePolicy.id})" class="action-button">
                        <i class="icon warning"></i>
                        <span class="red">{{t('cache_policy@请设置内存容量提示')}}</span>
                    </a>
                </div>
            </div>

            <div class="config-item"
                v-if="cachePolicy.options.openFileCache != null && cachePolicy.options.openFileCache.isOn && cachePolicy.options.openFileCache.max > 0">
                <div class="item-label">{{t('cache_createPopup_html@缓存文件句柄缓存')}}</div>
                <div class="item-content">{{cachePolicy.options.openFileCache.max}}</div>
            </div>

            <div class="config-item" v-if="cachePolicy.options.enableSendfile">
                <div class="item-label">{{t('cache_createPopup_html@开启Sendfile')}}</div>
                <div class="item-content">
                    <span v-if="cachePolicy.options.enableSendfile" class="green"><i class="icon check"></i> {{t('cache_policy@已开启')}}</span>
                    <span v-else class="disabled"><i class="icon close"></i> {{t('cache_policy@未开启')}}</span>
                </div>
            </div>

            <div class="config-item"
                v-if="cachePolicy.options.minFreeSize != null && cachePolicy.options.minFreeSize.count > 0">
                <div class="item-label">{{t('cache_createPopup_html@缓存硬盘最小空余空间')}}</div>
                <div class="item-content">
                    <size-capacity-view :v-value="cachePolicy.options.minFreeSize"></size-capacity-view>
                </div>
            </div>

            <div class="config-item" v-if="cachePolicy.options.enableIncompletePartialContent">
                <div class="item-label">{{t('cache_createPopup_html@允许读取不完整的PartialContent')}}</div>
                <div class="item-content">
                    <span class="green"><i class="icon check"></i> {{t('cache_policy@已开启')}}</span>
                </div>
            </div>
        </div>

        <div class="config-section" v-if="cachePolicy.type != 'file'">
            <div class="section-title">
                <i class="icon database"></i> {{t('cache_policy@缓存配置')}}
            </div>

            <div class="config-item">
                <div class="item-label">{{t('cache_policy@缓存最大容量')}}</div>
                <div class="item-content">
                    <size-capacity-view :v-value="cachePolicy.capacity" :v-default-text="t('cache_index_html@不限')"></size-capacity-view>
                    <p class="comment">{{t('cache_createPopup_html@内存缓存最大容量提示')}}</p>
                </div>
            </div>
        </div>

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

            <div class="config-item">
                <div class="item-label">{{t('cache_policy@最大内容长度')}}</div>
                <div class="item-content">
                    <size-capacity-view :v-value="cachePolicy.maxSize" :v-default-text="t('cache_index_html@不限')"></size-capacity-view>
                    <p class="comment">{{t('cache_createPopup_html@最大内容尺寸提示')}}</p>
                </div>
            </div>

            <div class="config-item">
                <div class="item-label">{{t('cache_createPopup_html@同步写入压缩缓存')}}</div>
                <div class="item-content">
                    <span v-if="cachePolicy.syncCompressionCache" class="green"><i class="icon check"></i> {{t('cache_policy@已开启')}}</span>
                    <span v-else class="disabled"><i class="icon close"></i> {{t('cache_policy@未开启')}}</span>
                </div>
            </div>

            <div class="config-item">
                <div class="item-label">{{t('cache_createPopup_html@预热超时时间')}}</div>
                <div class="item-content">
                    <span v-if="fetchTimeoutString.length > 0">{{fetchTimeoutString}}</span>
                    <span v-else class="disabled">{{t('cache_policy@使用默认')}}</span>
                </div>
            </div>

            <div class="config-item">
                <div class="item-label">{{t('addPopup@备注')}}</div>
                <div class="item-content">
                    <span v-if="cachePolicy.description.length > 0">{{cachePolicy.description}}</span>
                    <b-empty v-else>{{t('waf_group@暂时还没有描述')}}</b-empty>
                </div>
            </div>
        </div>
        <!-- {{t('cache_policy@默认缓存条件')}} -->
        <div class="config-section">
            <div class="section-title">
                <i class="icon filter"></i> {{t('cache_policy@默认缓存条件')}}
            </div>
            <div class="config-item">
                <http-cache-refs-box :v-cache-refs="cachePolicy.cacheRefs"></http-cache-refs-box>
            </div>
        </div>

        <!-- {{t('cache_policy@使用此策略的集群')}} -->
        <div class="config-section">
            <div class="section-title">
                <i class="icon server"></i> {{t('cache_policy@使用此策略的集群')}}
            </div>
            <div class="config-item">
                <b-empty v-if="clusters.length == 0">{{t('cache_policy@暂无集群使用此策略')}}</b-empty>
                <div class="domain-labels" v-if="clusters.length > 0">
                    <div class="domain-label" v-for="cluster in clusters">
                        <span class="domain-name">
                            <i class="icon server"></i>
                            {{cluster.name}}
                            <link-icon :href="'/clusters/cluster?clusterId=' + cluster.id"></link-icon>
                        </span>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>