2021-11-09 17:36:38 +08:00
|
|
|
|
Vue.component("traffic-limit-config-box", {
|
|
|
|
|
|
props: ["v-traffic-limit"],
|
2021-10-21 17:10:08 +08:00
|
|
|
|
data: function () {
|
2021-11-09 17:36:38 +08:00
|
|
|
|
let config = this.vTrafficLimit
|
2021-10-21 17:10:08 +08:00
|
|
|
|
if (config == null) {
|
|
|
|
|
|
config = {
|
|
|
|
|
|
isOn: false,
|
|
|
|
|
|
dailySize: {
|
|
|
|
|
|
count: -1,
|
|
|
|
|
|
unit: "gb"
|
|
|
|
|
|
},
|
|
|
|
|
|
monthlySize: {
|
|
|
|
|
|
count: -1,
|
|
|
|
|
|
unit: "gb"
|
|
|
|
|
|
},
|
|
|
|
|
|
totalSize: {
|
|
|
|
|
|
count: -1,
|
|
|
|
|
|
unit: "gb"
|
|
|
|
|
|
},
|
|
|
|
|
|
noticePageBody: ""
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2021-10-30 22:33:56 +08:00
|
|
|
|
if (config.dailySize == null) {
|
|
|
|
|
|
config.dailySize = {
|
|
|
|
|
|
count: -1,
|
|
|
|
|
|
unit: "gb"
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
if (config.monthlySize == null) {
|
|
|
|
|
|
config.monthlySize = {
|
|
|
|
|
|
count: -1,
|
|
|
|
|
|
unit: "gb"
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
if (config.totalSize == null) {
|
|
|
|
|
|
config.totalSize = {
|
|
|
|
|
|
count: -1,
|
|
|
|
|
|
unit: "gb"
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2021-10-21 17:10:08 +08:00
|
|
|
|
return {
|
|
|
|
|
|
config: config
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
methods: {
|
|
|
|
|
|
showBodyTemplate: function () {
|
|
|
|
|
|
this.config.noticePageBody = `<!DOCTYPE html>
|
|
|
|
|
|
<html>
|
|
|
|
|
|
<head>
|
2021-11-09 17:36:38 +08:00
|
|
|
|
<title>Traffic Limit Exceeded Warning</title>
|
2021-10-21 17:10:08 +08:00
|
|
|
|
<body>
|
|
|
|
|
|
|
2021-12-02 14:45:51 +08:00
|
|
|
|
<h1>Traffic Limit Exceeded Warning</h1>
|
|
|
|
|
|
<p>The site traffic has exceeded the limit. Please contact with the site administrator.</p>
|
|
|
|
|
|
<address>Request ID: \${requestId}.</address>
|
2021-10-21 17:10:08 +08:00
|
|
|
|
|
|
|
|
|
|
</body>
|
|
|
|
|
|
</html>`
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
template: `<div>
|
2021-11-09 17:36:38 +08:00
|
|
|
|
<input type="hidden" name="trafficLimitJSON" :value="JSON.stringify(config)"/>
|
2021-10-21 17:10:08 +08:00
|
|
|
|
<table class="ui table selectable definition">
|
|
|
|
|
|
<tbody>
|
|
|
|
|
|
<tr>
|
|
|
|
|
|
<td class="title">是否启用</td>
|
|
|
|
|
|
<td>
|
|
|
|
|
|
<checkbox v-model="config.isOn"></checkbox>
|
2021-11-09 17:36:38 +08:00
|
|
|
|
<p class="comment">注意：由于流量统计是每5分钟统计一次，所以超出流量限制后，对用户的提醒也会有所延迟。</p>
|
2021-10-21 17:10:08 +08:00
|
|
|
|
</td>
|
|
|
|
|
|
</tr>
|
|
|
|
|
|
</tbody>
|
|
|
|
|
|
<tbody v-show="config.isOn">
|
|
|
|
|
|
<tr>
|
2021-11-09 17:36:38 +08:00
|
|
|
|
<td>日流量限制</td>
|
2021-10-21 17:10:08 +08:00
|
|
|
|
<td>
|
|
|
|
|
|
<size-capacity-box :v-value="config.dailySize"></size-capacity-box>
|
|
|
|
|
|
</td>
|
|
|
|
|
|
</tr>
|
|
|
|
|
|
<tr>
|
2021-11-09 17:36:38 +08:00
|
|
|
|
<td>月流量限制</td>
|
2021-10-21 17:10:08 +08:00
|
|
|
|
<td>
|
|
|
|
|
|
<size-capacity-box :v-value="config.monthlySize"></size-capacity-box>
|
|
|
|
|
|
</td>
|
|
|
|
|
|
</tr>
|
|
|
|
|
|
<!--<tr>
|
|
|
|
|
|
<td>总体限制</td>
|
|
|
|
|
|
<td>
|
|
|
|
|
|
<size-capacity-box :v-value="config.totalSize"></size-capacity-box>
|
|
|
|
|
|
<p class="comment"></p>
|
|
|
|
|
|
</td>
|
|
|
|
|
|
</tr>-->
|
|
|
|
|
|
<tr>
|
|
|
|
|
|
<td>网页提示内容</td>
|
|
|
|
|
|
<td>
|
|
|
|
|
|
<textarea v-model="config.noticePageBody"></textarea>
|
2022-06-16 19:32:40 +08:00
|
|
|
|
<p class="comment"><a href="" @click.prevent="showBodyTemplate">[使用模板]</a>。当达到流量限制时网页显示的HTML内容，不填写则显示默认的提示内容，适用于网站类服务。</p>
|
2021-10-21 17:10:08 +08:00
|
|
|
|
</td>
|
|
|
|
|
|
</tr>
|
|
|
|
|
|
</tbody>
|
|
|
|
|
|
</table>
|
|
|
|
|
|
<div class="margin"></div>
|
|
|
|
|
|
</div>`
|
|
|
|
|
|
})
|
