{$layout}
{$template "menu"}

<form class="ui form" data-tea-success="success" data-tea-action="$">
    <csrf-token></csrf-token>
    <div class="config-section">
        <div class="section-title">
            {{t('index_流量统计设置_0101')}}
        </div>

        <div class="config-item">
            <div class="item-label">{{t('index_带宽百分位_0101')}}</div>
            <div class="item-content">
                <div class="ui input right labeled">
                    <input type="text" maxlength="3" size="3" style="width: 4em" name="bandwidthPercentile" v-model="config.bandwidthPercentile"/>
                    <span class="ui label">th</span>
                </div>
                <p class="comment">{{t('index_取值在1-100之间_0101')}}。</p>
            </div>
        </div>

        <div class="config-item">
            <div class="item-label">{{t('index_默认日期范围_0101')}}</div>
            <div class="item-content">
                <b-select
                    name="defaultBandwidthDateRange"
                    v-model="config.defaultBandwidthDateRange"
                    auto-width
                    :options="[
                        ...dateRanges.map(dateRange => ({
                            label: dateRange.name,
                            value: dateRange.code,
                        }))
                    ]"
                ></b-select>
            </div>
        </div>

        <div class="config-item">
            <div class="item-label">{{t('index_带宽算法_0101')}}</div>
            <div class="item-content">
                <b-select
                    name="bandwidthAlgo"
                    v-model="config.bandwidthAlgo"
                    auto-width
                    :options="[
                        {label: t('index_峰值带宽_0101'), value: 'secondly'},
                        {label: t('index_平均带宽_0101'), value: 'avg'},
                    ]"
                ></b-select>
                <p class="comment" v-if="config.bandwidthAlgo == 'secondly'">{{t('index_按在计时时间段内（5分钟）最高带宽峰值计算，比如5分钟内最高的某个时间点带宽为100Mbps，那么就认为此时间段内的峰值带宽为100Mbps。修改此选项会同时影响到带宽计费。_0101')}}</p>
                <p class="comment" v-if="config.bandwidthAlgo == 'avg'">{{t('index_按在计时时间段内（5分钟）平均带宽计算，即此时间段内的总流量除以时间段的秒数，比如5分钟（300秒）内总流量600MiB，那么带宽即为_0101')}}<code-label>600MiB * 8bit/300s = 16Mbps</code-label>；{{t('index_通常平均带宽算法要比峰值带宽要少很多。修改此选项会同时影响到带宽计费。_0101')}} </p>
            </div>
        </div>

        <div class="config-item">
            <div class="item-label"></div>
            <div class="item-content">
                <submit-btn></submit-btn>
            </div>
        </div>
    </div>
</form>