146 lines
5.2 KiB
Plaintext
146 lines
5.2 KiB
Plaintext
|
||
@{
|
||
Layout = "_UserLayout";
|
||
}
|
||
<div id="app">
|
||
<div class="boxes margin-top-5 clearfix">
|
||
<div>
|
||
<input v-model="ip" type="text" style="width:25%" placeholder="请输入ip地址并点击保存白名单" />
|
||
<button v-on:click="set_ip()" type="button" class="btn btn-primary" ><span class="glyphicon glyphicon-plus"></span>保存</button>
|
||
</div>
|
||
<div class=" margin-top-30">
|
||
<h5>当前白名单列表 <span class="text-warning">当前仅允许保留白名单数量：5个</span></h5>
|
||
<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 vm = new Vue({
|
||
el:'#app',
|
||
data:{
|
||
ip_list:[],
|
||
ip:'',
|
||
},
|
||
created:function(){
|
||
this.get_list();
|
||
},
|
||
methods:{
|
||
get_list() {
|
||
let data = {
|
||
cookie:document.cookie,
|
||
}
|
||
var that = this;
|
||
|
||
$.ajax({
|
||
type: 'POST',
|
||
url: 'http://php-api.juip.com/http/user/white_list',
|
||
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: 'http://php-api.juip.com/http/user/create_white_ip',
|
||
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: 'http://php-api.juip.com/http/user/lock_ip',
|
||
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: 'http://php-api.juip.com/http/user/delete_ip',
|
||
dataType: "json",
|
||
contentType: "application/json",
|
||
data: JSON.stringify(dataa),
|
||
beforeSend: function(xhr) {
|
||
xhr.withCredentials = true;
|
||
},
|
||
crossDomain: true,
|
||
success: function (res) {
|
||
that.get_list()
|
||
}
|
||
});
|
||
}
|
||
}
|
||
});
|
||
</script> |