Initial commit (code only without large binaries)
This commit is contained in:
robin
5
EdgeUser/web/views/@default/servers/fee/@menu.html
Normal file
5
EdgeUser/web/views/@default/servers/fee/@menu.html
Normal file
@@ -0,0 +1,5 @@
|
||||
<first-menu>
|
||||
<menu-item href="." code="index">计费方式</menu-item>
|
||||
<menu-item href=".prices" v-if="showPrices" code="price">价格</menu-item>
|
||||
<menu-item href=".calculator" v-if="showPrices" code="calculator">价格计算器</menu-item>
|
||||
</first-menu>
|
||||
80
EdgeUser/web/views/@default/servers/fee/calculator.html
Normal file
80
EdgeUser/web/views/@default/servers/fee/calculator.html
Normal file
@@ -0,0 +1,80 @@
|
||||
{$layout}
|
||||
{$template "menu"}
|
||||
|
||||
<div class="margin"></div>
|
||||
|
||||
<form class="ui form" data-tea-action="$" data-tea-success="success" ref="calculatorForm">
|
||||
<table class="ui table definition selectable">
|
||||
<tr>
|
||||
<td class="title">计费类型</td>
|
||||
<td>
|
||||
<div v-if="config.canChangePriceType">
|
||||
<radio name="priceType" :v-value="'bandwidth'" v-model="config.priceType">按带宽计费</radio>
|
||||
 
|
||||
<radio name="priceType" :v-value="'traffic'" v-model="config.priceType">按流量计费</radio>
|
||||
</div>
|
||||
<div v-else-if="config.priceType == 'bandwidth'">
|
||||
<radio name="priceType" :v-value="'bandwidth'" v-model="config.priceType">按带宽计费</radio>
|
||||
</div>
|
||||
<div v-else-if="config.priceType == 'traffic'">
|
||||
<radio name="priceType" :v-value="'traffic'" v-model="config.priceType">按流量计费</radio>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr v-show="config.priceType == 'bandwidth'">
|
||||
<td>所需带宽</td>
|
||||
<td>
|
||||
<div class="ui fields inline">
|
||||
<div class="ui field">
|
||||
<input type="text" name="bandwidth" size="10" maxlength="10" @input="change" ref="bandwidthInput"/>
|
||||
</div>
|
||||
<div class="ui field">
|
||||
<select class="ui dropdown auto-width" name="bandwidthUnit" @change="change">
|
||||
<option value="mb">Mbps</option>
|
||||
<option value="gb">Gbps</option>
|
||||
<option value="tb">Tbps</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr v-show="config.priceType == 'traffic'">
|
||||
<td>所需流量</td>
|
||||
<td>
|
||||
<div class="ui fields inline">
|
||||
<div class="ui field">
|
||||
<input type="text" name="traffic" size="10" maxlength="10" @input="change" ref="trafficInput"/>
|
||||
</div>
|
||||
<div class="ui field">
|
||||
<select class="ui dropdown auto-width" name="trafficUnit" @change="change">
|
||||
<option value="gb">GiB</option>
|
||||
<option value="tb">TiB</option>
|
||||
<option value="eb">EiB</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr v-show="regions.length > 0">
|
||||
<td>所在区域</td>
|
||||
<td>
|
||||
<select class="ui dropdown auto-width" name="regionId" @change="change">
|
||||
<option value="0">[不区分区域]</option>
|
||||
<option v-for="region in regions" :value="region.id">{{region.name}}</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>价格</td>
|
||||
<td>
|
||||
<strong v-if="formattedAmount.length > 0">
|
||||
￥{{formattedAmount}}元
|
||||
<span v-if="hasRegionPrice" class="small grey" style="font-weight: normal">（基于区域价格设定）</span>
|
||||
</strong>
|
||||
<span v-else class="disabled">-</span>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<submit-btn>计算价格</submit-btn>
|
||||
</form>
|
||||
46
EdgeUser/web/views/@default/servers/fee/calculator.js
Normal file
46
EdgeUser/web/views/@default/servers/fee/calculator.js
Normal file
@@ -0,0 +1,46 @@
|
||||
Tea.context(function () {
|
||||
this.formattedAmount = ""
|
||||
this.hasRegionPrice = false
|
||||
|
||||
this.$delay(function () {
|
||||
this.changePriceType(this.config.priceType)
|
||||
|
||||
this.$watch("config.priceType", function (priceType) {
|
||||
this.formattedAmount = ""
|
||||
this.changePriceType(priceType)
|
||||
})
|
||||
})
|
||||
|
||||
this.success = function (resp) {
|
||||
this.formattedAmount = resp.data.amountFormatted
|
||||
this.hasRegionPrice = resp.data.hasRegionPrice
|
||||
}
|
||||
|
||||
this.changePriceType = function (priceType) {
|
||||
switch (priceType) {
|
||||
case "traffic":
|
||||
this.$refs.trafficInput.focus()
|
||||
break
|
||||
case "bandwidth":
|
||||
this.$refs.bandwidthInput.focus()
|
||||
break
|
||||
}
|
||||
}
|
||||
|
||||
this.requestId = ""
|
||||
this.change = function () {
|
||||
this.formattedAmount = ""
|
||||
this.hasRegionPrice = false
|
||||
|
||||
let requestId = Math.random().toString()
|
||||
this.requestId = requestId
|
||||
|
||||
this.$post("$")
|
||||
.form(this.$refs.calculatorForm)
|
||||
.success(function (resp) {
|
||||
if (requestId == this.requestId) {
|
||||
this.success(resp)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
21
EdgeUser/web/views/@default/servers/fee/index.html
Normal file
21
EdgeUser/web/views/@default/servers/fee/index.html
Normal file
@@ -0,0 +1,21 @@
|
||||
{$layout}
|
||||
{$template "menu"}
|
||||
|
||||
<div class="margin"></div>
|
||||
|
||||
<form class="ui form">
|
||||
<table class="ui table definition">
|
||||
<tr>
|
||||
<td class="title">计费方式</td>
|
||||
<td>{{config.priceTypeName}}
|
||||
<a href="" v-if="config.canChangeType" @click.prevent="updatePriceType">[修改]</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>计费周期</td>
|
||||
<td>{{config.pricePeriodName}}
|
||||
<a href="" v-if="config.canChangePeriod" @click.prevent="updatePricePeriod">[修改]</a>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</form>
|
||||
21
EdgeUser/web/views/@default/servers/fee/index.js
Normal file
21
EdgeUser/web/views/@default/servers/fee/index.js
Normal file
@@ -0,0 +1,21 @@
|
||||
Tea.context(function () {
|
||||
this.updatePriceType = function () {
|
||||
teaweb.popup("/servers/fee/updatePriceTypePopup", {
|
||||
callback: function () {
|
||||
teaweb.success("保存成功", function () {
|
||||
window.location.reload()
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
this.updatePricePeriod = function () {
|
||||
teaweb.popup("/servers/fee/updatePricePeriodPopup", {
|
||||
callback: function () {
|
||||
teaweb.success("保存成功", function () {
|
||||
window.location.reload()
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
120
EdgeUser/web/views/@default/servers/fee/prices.html
Normal file
120
EdgeUser/web/views/@default/servers/fee/prices.html
Normal file
@@ -0,0 +1,120 @@
|
||||
{$layout}
|
||||
{$template "menu"}
|
||||
|
||||
<second-menu>
|
||||
<menu-item v-if="supportBandwidth" :class="{active: priceType == 'bandwidth'}" @click.prevent="setPriceType('bandwidth')">带宽价格</menu-item>
|
||||
<menu-item v-if="supportTraffic" :class="{active: priceType == 'traffic'}" @click.prevent="setPriceType('traffic')">流量价格</menu-item>
|
||||
</second-menu>
|
||||
|
||||
<!-- 带宽 -->
|
||||
<div v-if="supportBandwidth && priceType == 'bandwidth'">
|
||||
<table class="ui table definition selectable">
|
||||
<tr>
|
||||
<td class="title">带宽基础价格</td>
|
||||
<td>{{bandwidthPrices.base}}元/Mbps</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>带宽百分位</td>
|
||||
<td> {{bandwidthPrices.percentile}}th
|
||||
<p class="comment" v-if="bandwidthPrices.percentile < 100">采用计费周期内第{{bandwidthPrices.percentile}}%个计费点作为计费依据。</p>
|
||||
<p class="comment" v-else>采用计费周期内最大峰值带宽作为计费依据。</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr v-if="bandwidthPrices.ranges != null && bandwidthPrices.ranges.length > 0">
|
||||
<td>基础阶梯价格</td>
|
||||
<td>
|
||||
<table class="ui table selectable celled" style="width: 20em">
|
||||
<thead class="full-width">
|
||||
<tr>
|
||||
<th>带宽区间</th>
|
||||
<th>单价</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tr v-for="range in bandwidthPrices.ranges">
|
||||
<td><span v-if="range.minMB == 0">0bps</span><span v-else>{{formatMB(range.minMB)}}</span>-{{formatMB(range.maxMB)}}</td>
|
||||
<td>{{range.pricePerMB}}元/Mbps</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<div v-if="bandwidthPrices.supportRegions && regions.length > 0 && bandwidthItems.length > 0">
|
||||
<h4>区域带宽价格</h4>
|
||||
|
||||
<table class="ui table selectable small definition celled">
|
||||
<thead class="full-width">
|
||||
<tr>
|
||||
<th class="two wide">区域\带宽区间</th>
|
||||
<th v-for="item in bandwidthItems" class="center">
|
||||
{{item.name}}
|
||||
<br/>
|
||||
<span>{{item.minSize}}-{{item.maxSize}}</span>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tr v-for="region in regions" v-show="region.supportBandwidth">
|
||||
<td class="">{{region.name}}</td>
|
||||
<td v-for="item in bandwidthItems" class="center">
|
||||
<div>
|
||||
<span v-if="region.prices[item.id.toString()] != null">¥{{region.prices[item.id.toString()]}}元/Mbps </span>
|
||||
<span v-else class="disabled">[基础阶梯价格]</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 流量 -->
|
||||
<div v-if="supportTraffic && priceType == 'traffic'">
|
||||
<table class="ui table definition selectable">
|
||||
<tr>
|
||||
<td class="title">流量基础价格</td>
|
||||
<td>{{trafficPrices.base}}元/GiB</td>
|
||||
</tr>
|
||||
<tr v-if="trafficPrices.ranges != null && trafficPrices.ranges.length > 0">
|
||||
<td>基础阶梯价格</td>
|
||||
<td>
|
||||
<table class="ui table selectable celled" style="width: 20em">
|
||||
<thead class="full-width">
|
||||
<tr>
|
||||
<th>流量区间</th>
|
||||
<th>单价</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tr v-for="range in trafficPrices.ranges">
|
||||
<td><span v-if="range.minGB == 0">0B</span><span v-else>{{formatGB(range.minGB)}}</span>-{{formatGB(range.maxGB)}}</td>
|
||||
<td>{{range.pricePerGB}}元/GiB</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<div v-if="trafficPrices.supportRegions && regions.length > 0 && trafficItems.length > 0">
|
||||
<h4>区域流量价格</h4>
|
||||
|
||||
<table class="ui table selectable small definition celled">
|
||||
<thead class="full-width">
|
||||
<tr>
|
||||
<th class="two wide">区域\流量区间</th>
|
||||
<th v-for="item in trafficItems" class="center">
|
||||
{{item.name}}
|
||||
<br/>
|
||||
<span>{{item.minSize}}-{{item.maxSize}}</span>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tr v-for="region in regions" v-show="region.supportTraffic">
|
||||
<td class="">{{region.name}}</td>
|
||||
<td v-for="item in trafficItems" class="center">
|
||||
<div>
|
||||
<span v-if="region.prices[item.id.toString()] != null">¥{{region.prices[item.id.toString()]}}元/GiB </span>
|
||||
<span v-else class="disabled">[基础阶梯价格]</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
19
EdgeUser/web/views/@default/servers/fee/prices.js
Normal file
19
EdgeUser/web/views/@default/servers/fee/prices.js
Normal file
@@ -0,0 +1,19 @@
|
||||
Tea.context(function () {
|
||||
this.setPriceType = function (priceType) {
|
||||
this.priceType = priceType
|
||||
}
|
||||
|
||||
this.formatGB = function (gb) {
|
||||
if (gb == 0) {
|
||||
return "∞"
|
||||
}
|
||||
return teaweb.formatBytes(gb * 1024 * 1024 * 1024)
|
||||
}
|
||||
|
||||
this.formatMB = function (mb) {
|
||||
if (mb == 0) {
|
||||
return "∞"
|
||||
}
|
||||
return teaweb.formatBits(mb * 1024 * 1024)
|
||||
}
|
||||
})
|
||||
@@ -0,0 +1,20 @@
|
||||
{$layout "layout_popup"}
|
||||
|
||||
<h3>修改支付周期</h3>
|
||||
|
||||
<form class="ui form" data-tea-action="$" data-tea-success="success">
|
||||
<csrf-token></csrf-token>
|
||||
|
||||
<table class="ui table definition selectable">
|
||||
<tr>
|
||||
<td class="title">新支付周期 *</td>
|
||||
<td>
|
||||
<select class="ui dropdown auto-width" name="pricePeriod" v-model="pricePeriod">
|
||||
<option v-for="p in pricePeriods" :value="p.code">{{p.name}}</option>
|
||||
</select>
|
||||
<p class="comment" v-for="p in pricePeriods" v-if="pricePeriod == p.code">{{p.description}}如果当前计费周期内已经生成账单，则支付周期变更将在下个计费周期内生效。</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<submit-btn></submit-btn>
|
||||
</form>
|
||||
@@ -0,0 +1,20 @@
|
||||
{$layout "layout_popup"}
|
||||
|
||||
<h3>修改支付方式</h3>
|
||||
|
||||
<form class="ui form" data-tea-action="$" data-tea-success="success">
|
||||
<csrf-token></csrf-token>
|
||||
|
||||
<table class="ui table definition selectable">
|
||||
<tr>
|
||||
<td class="title">新支付方式 *</td>
|
||||
<td>
|
||||
<select class="ui dropdown auto-width" name="priceType" v-model="priceType">
|
||||
<option v-for="p in priceTypes" :value="p.code">{{p.name}}</option>
|
||||
</select>
|
||||
<p class="comment" v-for="p in priceTypes" v-if="priceType == p.code">{{p.description}}如果当前计费周期内已经生成账单，则支付方式变更将在下个计费周期内生效。</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<submit-btn></submit-btn>
|
||||
</form>
|
||||
Reference in New Issue
Block a user