|
|
<style>
|
|
|
.degrade-page {
|
|
|
padding: 20px;
|
|
|
}
|
|
|
|
|
|
.degrade-tab li {
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
|
|
|
.pc-degrade,
|
|
|
.wap-degrade {
|
|
|
list-style: none;
|
|
|
padding: 20px;
|
|
|
}
|
|
|
|
|
|
.err-tip {
|
|
|
color: #a94442;
|
|
|
}
|
|
|
</style>
|
|
|
<div class="degrade-page">
|
|
|
<div class="panel panel-info">
|
|
|
<div class="panel-heading">zookeeper server</div>
|
|
|
<div class="panel-body">
|
|
|
<div class="form-inline">
|
|
|
<div class="form-group">
|
|
|
<label for="server-ip">Server IP</label>
|
|
|
<input id="server-ip" class="form-control" type="text" placeholder="input server ip" value="{{ip}}">
|
|
|
</div>
|
|
|
<div class="form-group">
|
|
|
<label for="server-port">Server Port</label>
|
|
|
<input id="server-port" class="form-control" type="text" placeholder="input server port" value="{{port}}">
|
|
|
</div>
|
|
|
<span id="server-sure" class="btn btn-default">确定</span>
|
|
|
<span id="err-tip" class="err-tip hide">
|
|
|
<i class="glyphicon glyphicon-remove-sign"></i>
|
|
|
小哥,填错了吧
|
|
|
</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="panel panel-danger">
|
|
|
<div class="panel-heading">degrade point</div>
|
|
|
<div id="pjax-container" class="panel-body">
|
|
|
{{#render}}
|
|
|
<ul id="degrade-tab" class="nav nav-tabs degrade-tab" role="tablist">
|
|
|
<li role="presentation" class="active">
|
|
|
<a>PC</a>
|
|
|
</li>
|
|
|
<li role="presentation">
|
|
|
<a>WAP</a>
|
|
|
</li>
|
|
|
</ul>
|
|
|
|
|
|
<ul class="pc-degrade degrade-content">
|
|
|
{{#each pc}}
|
|
|
<li data-id="{{_id}}">
|
|
|
<div class="checkbox">
|
|
|
<label>
|
|
|
<input type="checkbox"{{#if checked}} checked{{/if}}>
|
|
|
{{name}}
|
|
|
</label>
|
|
|
</div>
|
|
|
</li>
|
|
|
{{/each}}
|
|
|
</ul>
|
|
|
|
|
|
<ul class="wap-degrade degrade-content hide">
|
|
|
{{#each wap}}
|
|
|
<li data-id="{{_id}}">
|
|
|
<div class="checkbox">
|
|
|
<label>
|
|
|
<input type="checkbox"{{#if checked}} checked{{/if}}>
|
|
|
{{name}}
|
|
|
</label>
|
|
|
</div>
|
|
|
</li>
|
|
|
{{/each}}
|
|
|
</ul>
|
|
|
{{^}}
|
|
|
Waitting for connecting to server...
|
|
|
{{/render}}
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<script>
|
|
|
$(function() {
|
|
|
var $ip = $('#server-ip');
|
|
|
var $port = $('#server-port');
|
|
|
var $tip = $('#err-tip');
|
|
|
|
|
|
function validateIP(ip) {
|
|
|
if (ip === 'localhost' ||
|
|
|
/^(0|[1-9]?|1\d\d?|2[0-4]\d|25[0-5])\.(0|[1-9]?|1\d\d?|2[0-4]\d|25[0-5])\.(0|[1-9]?|1\d\d?|2[0-4]\d|25[0-5])\.(0|[1-9]?|1\d\d?|2[0-4]\d|25[0-5])$/.test(ip))
|
|
|
{
|
|
|
$ip.closest('.form-group').removeClass('has-error');
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
$ip.closest('.form-group').addClass('has-error');
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
function validatePort(port) {
|
|
|
if (/^[1-9]\d*$/.test(port) && +port >= 1 && +port <= 65535) {
|
|
|
$port.closest('.form-group').removeClass('has-error');
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
$port.closest('.form-group').addClass('has-error');
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
// server
|
|
|
$('#server-sure').click(function() {
|
|
|
var ip = $.trim($ip.val());
|
|
|
var port = $.trim($port.val());
|
|
|
|
|
|
if (!validateIP(ip) || !validatePort(port)) {
|
|
|
$tip.removeClass('hide');
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
$tip.addClass('hide');
|
|
|
|
|
|
var serverPrompt = confirm('小伙砸,你确认修改zookeeper的server到:' + ip + ':' + port + '吗?')
|
|
|
|
|
|
if (!serverPrompt) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
$.ajax({
|
|
|
type: 'POST',
|
|
|
url: '/degrade/server',
|
|
|
data: {
|
|
|
ip: ip,
|
|
|
port: port
|
|
|
}
|
|
|
}).then(function(data) {
|
|
|
if (data.code === 200) {
|
|
|
$.pjax.reload('#pjax-container');
|
|
|
}
|
|
|
});
|
|
|
});
|
|
|
|
|
|
$('#degrade-tab').on('click', 'li', function() {
|
|
|
var $this = $(this);
|
|
|
|
|
|
if ($this.hasClass('active')) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
$('li', $('#degrade-tab')).toggleClass('active');
|
|
|
|
|
|
var index = $this.index();
|
|
|
|
|
|
if (index === 0) {
|
|
|
|
|
|
//PC active
|
|
|
$('.pc-degrade').removeClass('hide');
|
|
|
$('.wap-degrade').addClass('hide');
|
|
|
} else {
|
|
|
|
|
|
// wap active
|
|
|
$('.wap-degrade').removeClass('hide');
|
|
|
$('.pc-degrade').addClass('hide');
|
|
|
}
|
|
|
});
|
|
|
|
|
|
// change
|
|
|
$('.degrade-content input[type="checkbox"]').change(function() {
|
|
|
var $checkbox = $(this),
|
|
|
$li = $checkbox.closest('li');
|
|
|
|
|
|
var checked = $checkbox.prop('checked');
|
|
|
|
|
|
var id = $li.data('id');
|
|
|
|
|
|
$.ajax({
|
|
|
url: '/degrade/setter',
|
|
|
data: {
|
|
|
checked: checked,
|
|
|
id: id
|
|
|
}
|
|
|
});
|
|
|
});
|
|
|
})
|
|
|
</script> |
|
|
\ No newline at end of file |
...
|
...
|
|