jumpserver/apps/ops/templates/ops/celery_task_log.html

84 lines
2.5 KiB
HTML

{% load static %}
<head>
<title>term.js</title>
<script src="{% static 'js/jquery-2.1.1.js' %}"></script>
<script src="{% static 'js/plugins/xterm/xterm.js' %}"></script>
<link rel="stylesheet" href="{% static 'js/plugins/xterm/xterm.css' %}" />
<style>
body {
background-color: black;
}
.xterm-rows {
{#padding: 15px;#}
font-family: "Bitstream Vera Sans Mono", Monaco, "Consolas", Courier, monospace;
font-size: 13px;
}
</style>
</head>
<div id="term" style="height: 100%;width: 100%">
</div>
<script>
var rowHeight = 18;
var colWidth = 10;
var mark = '';
var url = "{% url 'api-ops:celery-task-log' pk=object.id %}";
var term;
var end = false;
var error = false;
var interval = 200;
function calWinSize() {
var t = $('#marker');
{#rowHeight = 1.00 * t.height();#}
{#colWidth = 1.00 * t.width() / 6;#}
}
function resize() {
{#console.log(rowHeight, window.innerHeight);#}
{#console.log(colWidth, window.innerWidth);#}
var rows = Math.floor(window.innerHeight / rowHeight) - 1;
var cols = Math.floor(window.innerWidth / colWidth) - 2;
console.log(rows, cols);
term.resize(cols, rows);
}
function requestAndWrite() {
if (!end) {
$.ajax({
url: url + '?mark=' + mark,
method: "GET",
contentType: "application/json; charset=utf-8"
}).done(function(data, textStatue, jqXHR) {
if (jqXHR.status === 203) {
error = true;
term.write('.');
interval = 500;
}
if (jqXHR.status === 200){
term.write(data.data);
mark = data.mark;
if (data.end){
end = true
}
}
})
}
}
$(document).ready(function () {
term = new Terminal();
term.open(document.getElementById('term'));
term.resize(80, 24);
resize();
term.on('data', function (data) {
{#term.write(data.replace('\r', '\r\n'))#}
term.write(data);
});
window.onresize = function () {
resize()
};
{#$('.terminal').detach().appendTo('#term');#}
setInterval(function () {
requestAndWrite()
}, interval)
});
</script>