66 lines
2.6 KiB
HTML
66 lines
2.6 KiB
HTML
{$layout}
|
|
{$template "menu"}
|
|
|
|
<div v-if="!canUsePlans">
|
|
<div class="ui message warning">尚未在 <a href="/finance/fee">[计费设置]</a> 里开启"使用套餐计费"选项，用户将无法使用套餐。</div>
|
|
</div>
|
|
|
|
<p class="comment" v-if="plans.length == 0">暂时还没有套餐。</p>
|
|
|
|
<table class="ui table selectable celled" v-if="plans.length > 0" id="sortable-table">
|
|
<thead>
|
|
<tr>
|
|
<th style="width:3em"></th>
|
|
<th>名称</th>
|
|
<th>集群</th>
|
|
<th>网站数</th>
|
|
<th class="four wide">价格设置</th>
|
|
<th class="width6">状态</th>
|
|
<th class="two op">操作</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody v-for="plan in plans" :v-id="plan.id">
|
|
<tr>
|
|
<td style="text-align: center;"><i class="icon bars handle grey"></i> </td>
|
|
<td>
|
|
<a :href="'/plans/plan?planId=' + plan.id">{{plan.name}}</a>
|
|
<div v-if="plan.description.length > 0"><span class="small grey">{{plan.description}}</span></div>
|
|
<div>
|
|
<grey-label v-if="plan.priceType == 'period'">按时间周期</grey-label>
|
|
<grey-label v-if="plan.priceType == 'traffic'">按流量</grey-label>
|
|
<grey-label v-if="plan.priceType == 'bandwidth'">按带宽</grey-label>
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<span v-if="plan.cluster.id > 0">
|
|
<link-icon :href="'/clusters/cluster?clusterId=' + plan.cluster.id">{{plan.cluster.name}}</link-icon>
|
|
</span>
|
|
<span v-else class="red">[已删除]</span>
|
|
</td>
|
|
<td>
|
|
<span v-if="plan.totalServers > 0">{{plan.totalServers}}</span>
|
|
<span v-else class="disabled">没有限制</span>
|
|
</td>
|
|
<td>
|
|
<!-- 价格设置 -->
|
|
<plan-price-view :v-plan="plan"></plan-price-view>
|
|
|
|
<!-- 流量限制 -->
|
|
<plan-limit-view :value="plan"></plan-limit-view>
|
|
|
|
<!-- 带宽限制 -->
|
|
<plan-bandwidth-limit-view :value="plan"></plan-bandwidth-limit-view>
|
|
</td>
|
|
<td><label-on :v-is-on="plan.isOn"></label-on></td>
|
|
<td>
|
|
<a :href="'/plans/plan?planId=' + plan.id">详情</a>
|
|
<a href="" @click.prevent="deletePlan(plan.id)">删除</a>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
<p v-if="plans.length > 0" class="comment">可以拖动左侧的<i class="icon bars"></i>排序。</p>
|
|
<div id="bottom"></div>
|
|
|
|
<div class="page" v-html="page"></div> |