增加报表下载功能

pull/92/head
CHN-STUDENT 2020-12-01 16:21:23 +08:00
parent 032189e257
commit fa20e2ae35
4 changed files with 111 additions and 7 deletions

View File

@ -118,9 +118,9 @@ apt-get -y install python-setuptools python-dev build-essential
apt-get -y install python-pip apt-get -y install python-pip
pip install psutil pip install psutil
### for Windows: ### for Windows:
打开网址https://pypi.python.org/pypi?:action=display&name=psutil#downloads 安装 Python并添加到环境变量
下载psutil for windows程序包 pip3 install psutil
安装即可 嫌慢可以用阿里镜像 pip3 install psutil -i https://mirrors.aliyun.com/pypi/simple/
``` ```
打开云探针页面,就可以正常的监控。接下来把服务器和客户端脚本自行加入开机启动,或者进程守护,或以后台方式运行即可!例如: nohup python client-linux.py & 打开云探针页面,就可以正常的监控。接下来把服务器和客户端脚本自行加入开机启动,或者进程守护,或以后台方式运行即可!例如: nohup python client-linux.py &

View File

@ -55,6 +55,9 @@
<li><a href="#" onclick="setActiveStyleSheet('light')">白天</a></li> <li><a href="#" onclick="setActiveStyleSheet('light')">白天</a></li>
</ul> </ul>
</li> </li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" onclick="json2Excel()">下载统计报表</a>
</li>
</ul> </ul>
</div><!--/.nav-collapse --> </div><!--/.nav-collapse -->
</div> </div>
@ -73,11 +76,12 @@
</div> </div>
<p></p> <p></p>
</div> </div>
<table class="table table-striped table-condensed table-hover"> <table class="table table-striped table-condensed table-hover" id="info">
<thead> <thead>
<tr> <tr>
<th id="status4" style="text-align: center;">协议</th> <th id="status4" style="text-align: center;">协议</th>
<th id="ipstatus" style="text-align: center;">Flight</th> <th id="host" style="text-align: center;">地址</th>
<th id="ipstatus" style="text-align: center;">连接状态</th>
<th id="name">节点名</th> <th id="name">节点名</th>
<th id="type">虚拟化</th> <th id="type">虚拟化</th>
<th id="location">位置</th> <th id="location">位置</th>
@ -107,5 +111,6 @@
<script src="js/jquery.min.js"></script> <script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script> <script src="js/bootstrap.min.js"></script>
<script src="js/serverstatus.js"></script> <script src="js/serverstatus.js"></script>
<script src="js/xlsx.full.min.js"></script>
</body> </body>
</html> </html>

View File

@ -86,6 +86,7 @@ function uptime() {
$("#servers").append( $("#servers").append(
"<tr id=\"r" + i + "\" data-toggle=\"collapse\" data-target=\"#rt" + i + "\" class=\"accordion-toggle " + hack + "\">" + "<tr id=\"r" + i + "\" data-toggle=\"collapse\" data-target=\"#rt" + i + "\" class=\"accordion-toggle " + hack + "\">" +
"<td id=\"online4\"><div class=\"progress\"><div style=\"width: 100%;\" class=\"progress-bar progress-bar-warning\"><small>加载中</small></div></div></td>" + "<td id=\"online4\"><div class=\"progress\"><div style=\"width: 100%;\" class=\"progress-bar progress-bar-warning\"><small>加载中</small></div></div></td>" +
"<td id=\"host\">加载中</td>" +
"<td id=\"ip_status\"><div class=\"progress\"><div style=\"width: 100%;\" class=\"progress-bar progress-bar-warning\"><small>加载中</small></div></div></td>" + "<td id=\"ip_status\"><div class=\"progress\"><div style=\"width: 100%;\" class=\"progress-bar progress-bar-warning\"><small>加载中</small></div></div></td>" +
"<td id=\"name\">加载中</td>" + "<td id=\"name\">加载中</td>" +
"<td id=\"type\">加载中</td>" + "<td id=\"type\">加载中</td>" +
@ -146,10 +147,10 @@ function uptime() {
// mh361 or mh370, mourn mh370, 2014-03-08 01:20 lost from all over the world. // mh361 or mh370, mourn mh370, 2014-03-08 01:20 lost from all over the world.
if (result.servers[i].ip_status) { if (result.servers[i].ip_status) {
TableRow.children["ip_status"].children[0].children[0].className = "progress-bar progress-bar-success"; TableRow.children["ip_status"].children[0].children[0].className = "progress-bar progress-bar-success";
TableRow.children["ip_status"].children[0].children[0].innerHTML = "<small>MH361</small>"; TableRow.children["ip_status"].children[0].children[0].innerHTML = "<small>Normal</small>";
} else { } else {
TableRow.children["ip_status"].children[0].children[0].className = "progress-bar progress-bar-danger"; TableRow.children["ip_status"].children[0].children[0].className = "progress-bar progress-bar-danger";
TableRow.children["ip_status"].children[0].children[0].innerHTML = "<small>MH370</small>"; TableRow.children["ip_status"].children[0].children[0].innerHTML = "<small>Lost</small>";
} }
// Name // Name
@ -158,6 +159,9 @@ function uptime() {
// Type // Type
TableRow.children["type"].innerHTML = result.servers[i].type; TableRow.children["type"].innerHTML = result.servers[i].type;
//Host
TableRow.children["host"].innerHTML = result.servers[i].host;
// Location // Location
TableRow.children["location"].innerHTML = result.servers[i].location; TableRow.children["location"].innerHTML = result.servers[i].location;
if (!result.servers[i].online4 && !result.servers[i].online6) { if (!result.servers[i].online4 && !result.servers[i].online6) {
@ -425,3 +429,75 @@ window.onunload = function(e) {
var cookie = readCookie("style"); var cookie = readCookie("style");
var title = cookie ? cookie : getPreferredStyleSheet(); var title = cookie ? cookie : getPreferredStyleSheet();
setActiveStyleSheet(title); setActiveStyleSheet(title);
// Excel 报表导出参考https://www.cnblogs.com/zhenggaowei/p/11732170.html
var fileName = '';
function json2Excel() {
var wopts = {
bookType: 'xlsx',
bookSST: false,
type: 'binary'
};
var workBook = {
SheetNames: ['Sheet1'],
Sheets: {},
Props: {}
};
/**
TODO:
多余信息现在隐藏不导出后期再优化
Author:CHN-STUDENT <chn-student@outlook.com> 2020.12.01
*/
var elements1 = document.getElementsByClassName('expandRow even');
var elements2 =document.getElementsByClassName('expandRow hack');
Array.prototype.forEach.call(elements1, function (element) {
element.style.display = 'none';
});
Array.prototype.forEach.call(elements2, function (element) {
element.style.display = 'none';
});
workBook.Sheets['Sheet1'] = XLSX.utils.table_to_sheet(document.getElementById('info'),{display:true});
//3、XLSX.write() 开始编写Excel表格
//4、changeData() 将数据处理成需要输出的格式
saveAs(new Blob([changeData(XLSX.write(workBook, wopts))], { type: 'application/octet-stream' }))
Array.prototype.forEach.call(elements1, function (element) {
element.style = 'block';
});
Array.prototype.forEach.call(elements2, function (element) {
element.style = '';
});
}
function changeData(s) {
//如果存在ArrayBuffer对象(es6) 最好采用该对象
if (typeof ArrayBuffer !== 'undefined') {
//1、创建一个字节长度为s.length的内存区域
var buf = new ArrayBuffer(s.length);
//2、创建一个指向buf的Unit8视图开始于字节0直到缓冲区的末尾
var view = new Uint8Array(buf);
//3、返回指定位置的字符的Unicode编码
for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
return buf;
} else {
var buf = new Array(s.length);
for (var i = 0; i != s.length; ++i) buf[i] = s.charCodeAt(i) & 0xFF;
return buf;
}
}
function saveAs(obj, fileName) {//当然可以自定义简单的下载文件实现方式
var tmpa = document.createElement("a");
tmpa.download = fileName ? fileName + '.xlsx' : new Date().getTime() + '.xlsx';
tmpa.href = URL.createObjectURL(obj); //绑定a标签
tmpa.click(); //模拟点击实现下载
setTimeout(function () { //延时释放
URL.revokeObjectURL(obj); //用URL.revokeObjectURL()来释放这个object URL
}, 100);
}

23
web/js/xlsx.full.min.js vendored Normal file

File diff suppressed because one or more lines are too long