filesite
/
hero_union
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

add css for index.html

master
filesite 8 months ago
parent
bcdca5df59
commit
36d5979866
1 changed files with 110 additions and 10 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 116
      public/index.html

116
public/index.html
Unescape View File

@ -4,25 +4,122 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width"> <meta name="viewport" content="width=device-width">
<title>HeroUnion英雄联盟 - Hero爬虫联盟</title> <title>HeroUnion英雄联盟 - 开源的Hero爬虫联盟</title>
<meta name="author" content="HeroUnion英雄联盟 - filesite.io"> <meta name="author" content="filesite.io">
<meta name="description" content="HeroUnion: A union of hero bots, Hero爬虫的英雄联盟。"> <meta name="description" content="HeroUnion: A union of hero bots, 开源的Hero爬虫联盟。">
<style>
*,body{margin:0;padding:0}
body{padding:8px;max-width:640px;margin:0 auto}
h1{font-size:2em;font-weight:500}
small{font-size:65%;font-weight:400}
pre{background-color:#DDD;padding-bottom:3px;padding-right:3px;border-radius:0 5px 0 5px;max-width:480px}
code{display:block;background-color:#EEE;padding:4px}
.text-center{text-align:center}
.mt-d5{margin-top:0.5em}
.mt-1{margin-top:1em}
.mt-4{margin-top:4em}
.stats{background-color:#EEE;padding:10px}
.col{display:inline-block;padding:13px 4px;width:20%;background:#444;color:#FFF;margin-right:4px;margin-bottom:6px;text-align:center}
.col strong{font-size:24px}
.col label{display:block;font-size:15px}
.info{background-color:darkblue}
.success{background-color:green}
.warning{background-color:orange;color:#444}
.danger{background-color:red}
.disable{background-color:gray}
@media(max-width:480px) {
h1 small{display:block}
}
</style>
<script src="/js/jquery-3.7.1.min.js"></script> <script src="/js/jquery-3.7.1.min.js"></script>
</head> </head>
<body> <body>
<h1>HeroUnion英雄联盟 <small>- Hero爬虫联盟</small></h1> <h1 class="text-center">HeroUnion英雄联盟 - <small>开源的Hero爬虫联盟</small></h1>
<h3>HeroUnion联盟状态</h3> <hr class="mt-d5">
<pre><code id="herounion_stats">...</code></pre>
<h3>HeroUnion源码下载</h3> <h3 class="mt-1">HeroUnion源码下载</h3>
<p><a href="https://git.filesite.io/filesite/hero_union" target="_blank">https://git.filesite.io/filesite/hero_union</a></p> <p><a href="https://git.filesite.io/filesite/hero_union" target="_blank">https://git.filesite.io/filesite/hero_union</a></p>
<h3>HeroBot - Machete Hero源码下载</h3> <h3 class="mt-1">HeroBot - Machete Hero源码下载</h3>
<p><a href="https://git.filesite.io/filesite/machete_hero" target="_blank">https://git.filesite.io/filesite/machete_hero</a></p> <p><a href="https://git.filesite.io/filesite/machete_hero" target="_blank">https://git.filesite.io/filesite/machete_hero</a></p>
<h3 class="mt-1">HeroUnion联盟状态 - 已运行<span class="run_time">...</span></h3>
<h4 class="mt-d5">任务状态</h4>
<div class="stats taskStatus">
<span class="col">
<strong class="total">...</strong>
<label>总数</label>
</span>
<span class="col info">
<strong class="waiting">...</strong>
<label>等待中</label>
</span>
<span class="col warning">
<strong class="running">...</strong>
<label>执行中</label>
</span>
<span class="col success">
<strong class="done">...</strong>
<label>完成</label>
</span>
<span class="col danger">
<strong class="failed">...</strong>
<label>失败</label>
</span>
</div>
<h4 class="mt-d5">爬虫状态</h4>
<div class="stats heroStatus">
<span class="col">
<strong class="total">...</strong>
<label>总数</label>
</span>
<span class="col success">
<strong class="idle">...</strong>
<label>空闲</label>
</span>
<span class="col warning">
<strong class="busy">...</strong>
<label>繁忙</label>
</span>
<span class="col disable">
<strong class="offline">...</strong>
<label>离线</label>
</span>
</div>
<h4 class="mt-d5">JSON数据</h4>
<pre><code id="herounion_stats">...</code></pre>
<footer class="mt-4 text-center">
&copy;copyright <a href="https://filesite.io" target="_blank">FileSite.io</a>
</footer>
<script type="text/javascript"> <script type="text/javascript">
var formatSeconds = function(secs) {
var str = secs + '秒';
if (secs > 86400) {
str = Math.floor(secs/86400) + '天';
}else if (secs > 3600) {
str = Math.floor(secs/3600) + '小时';
}else if (secs > 86400*365) {
str = Math.floor(secs/86400/365) + '年'
+ Math.floor( (secs - Math.floor(secs/86400/365)) / 86400 ) + '天';
}
return str;
};
var renderStats = function(data) {
for (var key in data) {
$('.'+key).text(data[key]);
}
};
var api = '/api/stats/'; var api = '/api/stats/';
$.ajax({ $.ajax({
url: api, url: api,
@ -30,6 +127,9 @@
dataType: 'json' dataType: 'json'
}).done(function(data) { }).done(function(data) {
$('#herounion_stats').text(JSON.stringify(data, null, 4)); $('#herounion_stats').text(JSON.stringify(data, null, 4));
$('.run_time').text( formatSeconds(data.run_seconds) );
renderStats(data.taskStatus);
renderStats(data.heroStatus);
}); });
</script> </script>
</body> </body>

Write Preview
Loading…
Cancel
Save