新增短效无限量白名单处理
This commit is contained in:
wmp
312
Host/Views/User/HttpWhiteIpSU.cshtml
Normal file
312
Host/Views/User/HttpWhiteIpSU.cshtml
Normal file
@@ -0,0 +1,312 @@
|
||||
@{
|
||||
Layout = "_UserLayout";
|
||||
}
|
||||
|
||||
<div id="app">
|
||||
<div class="boxes margin-top-5 clearfix">
|
||||
<div style="display: flex; align-items: center;">
|
||||
<input v-model="ip" type="text" style="width: 350px; margin-right: 20px;" placeholder="请输入ip地址并点击保存白名单" />
|
||||
<button v-on:click="set_ip()" type="button" class="btn btn-primary"
|
||||
style="outline: none; box-shadow: none;">保存</button>
|
||||
</div>
|
||||
<div class="margin-top-30">
|
||||
<h5>当前白名单列表
|
||||
<span class="text-warning">当前白名单数量：{{ whiteLimit }} 个</span>
|
||||
<button type="button" class="btn btn-new btn-xs" data-toggle="modal" data-target="#whitelistModal"
|
||||
style="outline: none; box-shadow: none; margin-left: 60px;" v-on:click="get_package_details()">
|
||||
调整白名单上限
|
||||
</button>
|
||||
</h5>
|
||||
|
||||
<div class="modal fade" id="whitelistModal" tabindex="-1" role="dialog">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title">调整白名单上限</h5>
|
||||
<button type="button" class="close" data-dismiss="modal">
|
||||
<span>×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="d-flex align-items-center" style="gap: 15px;">
|
||||
<div class="modal-body btn-group" role="group">
|
||||
<button type="button" class="btn btn-new btn-xs" v-on:click="decreaseLimit"
|
||||
style=" outline: none; box-shadow: none;" :disabled="tempWhiteLimit <= 1">-</button>
|
||||
<span class="btn btn-default btn-xs">{{ tempWhiteLimit }}</span>
|
||||
<button type="button" class="btn btn-new btn-xs" v-on:click="increaseLimit"
|
||||
style="outline: none; box-shadow: none;" :disabled="tempWhiteLimit >= 20">+</button>
|
||||
</div>
|
||||
<div style="margin-left: 2rem; margin-bottom: 1rem">
|
||||
<span v-if="tempDiscount === 10">价格<span class="text-danger">无折扣</span></span>
|
||||
<span v-else class="text-danger">
|
||||
当前已应用 {{ tempDiscount*10 }}% 折扣
|
||||
</span>
|
||||
</div>
|
||||
<div style="margin-left: 2rem; margin-bottom: 1rem">
|
||||
调整后到期时间：{{ new Date(newExpre).toLocaleString() }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
|
||||
<button type="button" class="btn btn-primary" v-on:click="set_white_limit()">确定</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-sm-12">
|
||||
<table class="products-table responsive tablesaw tablesaw-stack" data-tablesaw-mode="stack">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>IP地址</th>
|
||||
<th>设置时间</th>
|
||||
<th>锁定状态</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="item in ip_list">
|
||||
<td style="display:none;">{{item.id}}</td>
|
||||
<td>{{item.ip}}</td>
|
||||
<td>{{item.createTime}}</td>
|
||||
<td>{{item.isLocked}}</td>
|
||||
<td>
|
||||
<a v-if="item.isLocked=='未锁定'" v-on:click="lock_ip(item.id,1)"
|
||||
class="btn btn-new">锁定</a>
|
||||
<a v-if="item.isLocked=='已锁定'" v-on:click="lock_ip(item.id,0)"
|
||||
class="btn btn-new">解锁</a>
|
||||
<a class="btn btn-danger" v-on:click="delete_ip(item.id)">删除</a>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
var baseUrl = '@ViewData["BaseUrl"]';
|
||||
var vm = new Vue({
|
||||
el: '#app',
|
||||
data: {
|
||||
ip_list: [],
|
||||
ip: '',
|
||||
whiteLimit: 1, //获取当前白名单的数量
|
||||
tempWhiteLimit: 1, //模态框中白名单的数量
|
||||
tempDiscount: 10,
|
||||
detail: {},
|
||||
newExpre: 0,
|
||||
},
|
||||
created: function () {
|
||||
this.get_list()
|
||||
this.get_white_limit()
|
||||
this.get_package_details()
|
||||
},
|
||||
methods: {
|
||||
get_list() {
|
||||
let data = {
|
||||
cookie: document.cookie,
|
||||
}
|
||||
var that = this;
|
||||
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: `${baseUrl}/http/user/white_list_su`,
|
||||
dataType: "json",
|
||||
contentType: "application/json",
|
||||
data: JSON.stringify(data),
|
||||
beforeSend: function (xhr) {
|
||||
xhr.withCredentials = true;
|
||||
},
|
||||
crossDomain: true,
|
||||
success: function (res) {
|
||||
that.ip_list = res.data
|
||||
}
|
||||
});
|
||||
},
|
||||
set_ip() {
|
||||
let data = {
|
||||
cookie: document.cookie,
|
||||
data: { ip: this.ip }
|
||||
}
|
||||
var that = this;
|
||||
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: `${baseUrl}/http/user/create_white_ip_su`,
|
||||
dataType: "json",
|
||||
contentType: "application/json",
|
||||
data: JSON.stringify(data),
|
||||
beforeSend: function (xhr) {
|
||||
xhr.withCredentials = true;
|
||||
},
|
||||
crossDomain: true,
|
||||
success: function (res) {
|
||||
that.get_list()
|
||||
}
|
||||
});
|
||||
},
|
||||
lock_ip(id, status) {
|
||||
var lock_ip = {};
|
||||
lock_ip.id = id;
|
||||
lock_ip.lock = status;
|
||||
let dataa = {
|
||||
cookie: document.cookie,
|
||||
data: lock_ip
|
||||
}
|
||||
var that = this;
|
||||
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: `${baseUrl}/http/user/lock_ip_su`,
|
||||
dataType: "json",
|
||||
contentType: "application/json",
|
||||
data: JSON.stringify(dataa),
|
||||
beforeSend: function (xhr) {
|
||||
xhr.withCredentials = true;
|
||||
},
|
||||
crossDomain: true,
|
||||
success: function (res) {
|
||||
that.get_list()
|
||||
}
|
||||
});
|
||||
},
|
||||
delete_ip(id) {
|
||||
var dalete_ip = {};
|
||||
dalete_ip.id = id;
|
||||
let dataa = {
|
||||
cookie: document.cookie,
|
||||
data: dalete_ip
|
||||
}
|
||||
var that = this;
|
||||
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: `${baseUrl}/http/user/delete_ip_su`,
|
||||
dataType: "json",
|
||||
contentType: "application/json",
|
||||
data: JSON.stringify(dataa),
|
||||
beforeSend: function (xhr) {
|
||||
xhr.withCredentials = true;
|
||||
},
|
||||
crossDomain: true,
|
||||
success: function (res) {
|
||||
that.get_list()
|
||||
}
|
||||
});
|
||||
},
|
||||
// 添加白名单数量
|
||||
setTempWhiteLimit(value) {
|
||||
this.tempWhiteLimit = Math.min(20, value)
|
||||
this.tempWhiteLimit = Math.max(1, value)
|
||||
this.tempDiscount = Math.max(6, 11 - value)
|
||||
|
||||
this.newExpre = this.calc_remain(this.detail.expireTime, this.whiteLimit, this.tempWhiteLimit)
|
||||
},
|
||||
increaseLimit() {
|
||||
this.setTempWhiteLimit(this.tempWhiteLimit + 1)
|
||||
},
|
||||
// 减少白名单数量
|
||||
decreaseLimit() {
|
||||
this.setTempWhiteLimit(this.tempWhiteLimit - 1)
|
||||
},
|
||||
//确定后把最新白名单数量调接口给后端
|
||||
set_white_limit() {
|
||||
let data = {
|
||||
cookie: document.cookie,
|
||||
data: { maxAmount: this.tempWhiteLimit }
|
||||
}
|
||||
var that = this;
|
||||
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: `${baseUrl}/http/user/white_limit_set_su`,
|
||||
dataType: "json",
|
||||
contentType: "application/json",
|
||||
data: JSON.stringify(data),
|
||||
beforeSend: function (xhr) {
|
||||
xhr.withCredentials = true;
|
||||
},
|
||||
crossDomain: true,
|
||||
success: function (res) {
|
||||
if (res.code > 0) {
|
||||
$('#whitelistModal').modal('hide');
|
||||
alert('白名单上限设置成功！');
|
||||
} else {
|
||||
alert('设置失败：' + (res.message || '未知错误'));
|
||||
}
|
||||
},
|
||||
error: function () {
|
||||
alert('设置失败，请重试！');
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 获取白名单当前的数量
|
||||
get_white_limit() {
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: `${baseUrl}/http/user/white_limit_get_su`,
|
||||
dataType: "json",
|
||||
contentType: "application/json",
|
||||
data: JSON.stringify({
|
||||
cookie: document.cookie,
|
||||
}),
|
||||
beforeSend: function (xhr) {
|
||||
xhr.withCredentials = true;
|
||||
},
|
||||
crossDomain: true,
|
||||
success: (res) => {
|
||||
if (res.code > 0) {
|
||||
this.whiteLimit = res.data
|
||||
this.setTempWhiteLimit(res.data)
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 获取最新套餐详情
|
||||
get_package_details() {
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: `${baseUrl}/http/user/get_unlimited_available`,
|
||||
dataType: "json",
|
||||
contentType: "application/json",
|
||||
data: JSON.stringify({
|
||||
cookie: document.cookie,
|
||||
}),
|
||||
beforeSend: function (xhr) {
|
||||
xhr.withCredentials = true;
|
||||
},
|
||||
crossDomain: true,
|
||||
success: (res) => {
|
||||
if (res.code < 0) alert('获取套餐信息失败')
|
||||
this.detail = res.data
|
||||
this.setTempWhiteLimit(this.tempWhiteLimit)
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 计算修改白名单上限后的剩余时间
|
||||
calc_remain(expire, maxWhitelist, newMaxWhitelist) {
|
||||
|
||||
// 套餐剩余秒数
|
||||
const now = Math.floor(Date.now() / 1000)
|
||||
const prev = expire ?? now
|
||||
const remain = prev - now
|
||||
|
||||
// 白名单比值，时间份数
|
||||
const multiple = maxWhitelist / newMaxWhitelist
|
||||
|
||||
// 折扣比值，新折扣作为基准
|
||||
const oldDiscount = Math.max(.6, 1 - .1 * (maxWhitelist - 1))
|
||||
const newDiscount = Math.max(.6, 1 - .1 * (newMaxWhitelist - 1))
|
||||
const offset = oldDiscount / newDiscount
|
||||
|
||||
// 手续费，固定 1%
|
||||
const fee = 99 / 100
|
||||
|
||||
// 返回新到期时间
|
||||
return Math.floor(remain * multiple * offset * fee + now) * 1000
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
Reference in New Issue
Block a user