OpenWrt_Luci_Lua/Mi_Lua/luci/view/web/setting/qos.htm
2015-05-09 18:48:46 +08:00

233 lines
6.9 KiB
HTML

<%
--[[
Info 应用限速
]]--
local ver = require("xiaoqiang.XQVersion").webVersion
local request_uri = luci.http.getenv("REQUEST_URI")
%>
<%include('web/inc/head')%>
<title>小米路由器</title>
<link rel="stylesheet" href="<%=resource%>/web/css/page.set.default.css?v=<%=ver%>"/>
</head>
<body>
<!-- upgread -->
<div class="mod-setting-panel">
<div class="hd">
<h3>应用限速状态</h3>
<a href="#" data-order="1" class="btn-offon btn-off" id="btnqos"></a>
</div>
<div class="bd">
<div class="mod-qos-app">
<form method="post" name="appqos" id="appqos" action="<%=luci.dispatcher.build_url('api','xqsystem','set_app_limit')%>" style="display:none;">
<h3>设置限速规则:</h3>
<table class="table">
<tr>
<th class="s0">应用名称</th>
<th class="s1">当前速度</th>
<th class="s2">
<span class="l">限速模式 <em>(0=不限速)</em></span>
<span class="r">
<button type="submit" id="btnSave" class="btn btn-primary btn-small" style="display:none;"><span>保存</span></button>
<button type="button" id="btnCancel" class="btn btn-small" style="display:none;"><span>取消</span></button>
<button type="button" id="btnEdit" class="btn btn-primary btn-small"><span>修改</span></button>
</span>
</th>
</tr>
<tr>
<td class="name">迅雷</td>
<td>
<p>上传<span id="speedupxunlei">--</span>/S</p>
<p>下载<span id="speeddownxunlei">--</span>/S</p>
</td>
<td id="appxunlei">
<div class="values">
<p class="up"></p>
<p class="down"></p>
</div>
<div class="inputs form form-small" style="display:none;">
<p class="item">
<span class="k">上传:</span>
<span class="v"><input name="xlmaxupload" type="text" class="text">KB/S</span>
<em class="t"></em>
</p>
<p class="item">
<span class="k">下载:</span>
<span class="v"><input name="xlmaxdownload" type="text" class="text">KB/S</span>
<em class="t"></em>
</p>
</div>
</td>
</tr>
<tr>
<td class="name">快盘</td>
<td>
<p>上传<span id="speedupkuaipan">--</span>/S</p>
<p>下载<span id="speeddownkuaipan">--</span>/S</p>
</td>
<td id="appkuaipan">
<div class="values">
<p class="up"></p>
<p class="down"></p>
</div>
<div class="inputs form form-small" style="display:none;">
<p class="item">
<span class="k">上传:</span>
<span class="v"><input name="kpmaxupload" type="text" class="text">KB/S</span>
<em class="t"></em>
</p>
<p class="item">
<span class="k">下载:</span>
<span class="v"><input name="kpmaxdownload" type="text" class="text">KB/S</span>
<em class="t"></em>
</p>
</div>
</td>
</tr>
</table>
</form>
</div>
</div>
</div>
<%include('web/inc/g.js.base')%>
<script>
var modelUpnp = (function(){
function qosStatus(){
$.getJSON('<%=luci.dispatcher.build_url("api", "xqsystem", "app_limit")%>', {}, function(rsp){
if (rsp.code == 0) {
var btnqos = $('#btnqos')[0],
listqos = $('#appqos');
if (rsp.enable === '0') {
btnqos.className = 'btn-offon btn-off';
listqos.hide();
}else{
btnqos.className = 'btn-offon btn-on';
listqos.show();
}
$('#speedupxunlei').html( byteFormat(rsp.xunlei.upload * 1024) );
$('#speeddownxunlei').html( byteFormat(rsp.xunlei.download * 1024) );
$('#speedupkuaipan').html( byteFormat(rsp.kuaipan.upload * 1024) );
$('#speeddownkuaipan').html( byteFormat(rsp.kuaipan.download * 1024) );
if (rsp.xunlei.enable === '1') {
$('#appxunlei .values .up').html(rsp.xunlei.maxupload == 0 ? '不限速' : '上传' + rsp.xunlei.maxupload + 'KB/S');
$('#appxunlei .values .down').html(rsp.xunlei.maxdownload == 0 ? '不限速' : '下载' + rsp.xunlei.maxdownload + 'KB/S');
}else{
$('#appxunlei .values .up').html('不限速');
$('#appxunlei .values .download').html('不限速');
}
if (rsp.kuaipan.enable === '1') {
$('#appkuaipan .values .up').html(rsp.kuaipan.maxupload == 0 ? '不限速' : '上传' + rsp.kuaipan.maxupload + 'KB/S');
$('#appkuaipan .values .down').html(rsp.kuaipan.maxdownload == 0 ? '不限速' : '下载' + rsp.kuaipan.maxdownload + 'KB/S');
}else{
$('#appkuaipan .values .up').html('不限速');
$('#appkuaipan .values .download').html('不限速');
}
$('[name=xlmaxupload]').val( rsp.xunlei.maxupload );
$('[name=xlmaxdownload]').val( rsp.xunlei.maxdownload );
$('[name=kpmaxupload]').val( rsp.kuaipan.maxupload );
$('[name=kpmaxdownload]').val( rsp.kuaipan.maxdownload );
}
});
}
function qosSwitch(){
var btnqos = $('#btnqos');
btnqos.on('click', function(e){
e.preventDefault();
var st = $(this).hasClass('btn-on') ? 0 : 1,
btn = this;
$.getJSON('<%=luci.dispatcher.build_url("api", "xqsystem", "app_limit_switch")%>', {'switch': st}, function(rsp){
if (rsp.code == 0) {
window.top.location.reload(1);
}
});
});
}
function qosset(){
$('#btnEdit').on('click', function(e){
e.preventDefault();
$('#appqos .values').hide();
$('#appqos .inputs').show();
$('#btnEdit').hide();
$('#btnSave').show();
$('#btnCancel').show();
});
$('#btnCancel').on('click', function(e){
e.preventDefault();
// qosStatus();
// $('#appqos .values').show();
// $('#appqos .inputs').hide();
// $('#btnEdit').show();
// $('#btnSave').hide();
// $('#btnCancel').hide();
self.location.reload(1);
});
$('#appqos').on('submit', function(e){
e.preventDefault();
var url = this.action,
method = this.method,
param = $(this).serialize(),
formName = this.name,
validator = FormValidator.checkAll(formName, [{
name: 'xlmaxdownload',
display :'下载速度',
rules: 'required|is_natural|less_than[100000]'
},
{
name: 'xlmaxupload',
display :'上传速度',
rules: 'required|is_natural|less_than[100000]'
},
{
name: 'kpmaxdownload',
display :'下载速度',
rules: 'required|is_natural|less_than[100000]'
},
{
name: 'kpmaxupload',
display :'上传速度',
rules: 'required|is_natural|less_than[100000]'
}]);
if (validator) {
$.ajax({
url: url,
type: method,
data: param,
dataType: 'json',
success: function(rsp){
if (rsp.code == 0) {
qosStatus();
$('#appqos .values').show();
$('#appqos .inputs').hide();
$('#btnEdit').show();
$('#btnSave').hide();
$('#btnCancel').hide();
}else{
window.top.art.dialog({
title: '消息框',
content: rsp.msg
});
}
}
});
}
});
}
return {
init : function(){
qosStatus();
qosSwitch();
qosset();
}
}
}());
$(function(){
modelUpnp.init();
});
</script>