mirror of
https://github.com/YunoHost/yunorunner.git
synced 2024-09-03 20:05:52 +02:00
[enh] integrate bulma.css for fun and profit
This commit is contained in:
parent
5b51fbfef6
commit
517877b74f
2 changed files with 80 additions and 26 deletions
|
@ -2,35 +2,38 @@
|
|||
<html>
|
||||
<head>
|
||||
<title>YunoRunner for CI</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.1/css/bulma.min.css">
|
||||
<script defer src="https://use.fontawesome.com/releases/v5.1.0/js/all.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
|
||||
<script src="https://code.jquery.com/jquery-3.3.1.min.js"
|
||||
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
|
||||
crossorigin="anonymous"></script>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Tasks</h1>
|
||||
<div id="jobs">
|
||||
<table border="0" cellspacing="5" cellpadding="5">
|
||||
<tr>
|
||||
<th>App</th>
|
||||
<th>State</th>
|
||||
<th>Revision</th>
|
||||
<th>Ynh Version</th>
|
||||
<th>Created time</th>
|
||||
<th>Started time</th>
|
||||
<th>End time</th>
|
||||
</tr>
|
||||
<tr v-for="(job, index) in jobs" :id="job.id">
|
||||
<td><a v-bind:href="'/job/' + job.id">{{job.name}}</a></td>
|
||||
<td>{{job.state}}</td>
|
||||
<td>{{job.target_revision}}</td>
|
||||
<td>{{job.yunohost_version}}</td>
|
||||
<td>{{job.created_time}}</td>
|
||||
<td>{{job.started_time}}</td>
|
||||
<td>{{job.end_time}}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<section class="section">
|
||||
<h1 class="title">Tasks</h1>
|
||||
<div id="jobs">
|
||||
<table class="table is-bordered is-hoverable is-striped is-fullwidth">
|
||||
<thead>
|
||||
<th>App</th>
|
||||
<th>State</th>
|
||||
<th>Revision</th>
|
||||
<th>Ynh Version</th>
|
||||
<th>Created time</th>
|
||||
<th>Started time</th>
|
||||
<th>End time</th>
|
||||
</thead>
|
||||
<tr v-for="(job, index) in jobs" :id="job.id">
|
||||
<td><a v-bind:href="'/job/' + job.id">{{job.name}}</a></td>
|
||||
<td>{{job.state}}</td>
|
||||
<td>{{job.target_revision}}</td>
|
||||
<td>{{job.yunohost_version}}</td>
|
||||
<td>{{job.created_time}}</td>
|
||||
<td>{{job.started_time}}</td>
|
||||
<td>{{job.end_time}}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
<script>
|
||||
(function() {
|
||||
var app = new Vue({
|
||||
|
|
51
templates/job.html
Normal file
51
templates/job.html
Normal file
|
@ -0,0 +1,51 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>YunoRunner for CI</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.1/css/bulma.min.css">
|
||||
<script defer src="https://use.fontawesome.com/releases/v5.1.0/js/all.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.1/css/bulma.min.css"></script>
|
||||
</head>
|
||||
<body>
|
||||
<section class="section" id="job">
|
||||
<h1 class="title">Job '{{job.name}}'</h1>
|
||||
|
||||
<table class="table is-bordered">
|
||||
<tr><th>State</th><td>{{job.state}}</td></tr>
|
||||
<tr><th>Target revision</th><td>{{job.target_revision}}</td></tr>
|
||||
<tr><th>YunoHost version</th><td>{{job.yunohost_version}}</td></tr>
|
||||
<tr><th>Created time</th><td>{{job.created_time}}</td></tr>
|
||||
<tr><th>Started time</th><td>{{job.started_time}}</td></tr>
|
||||
<tr><th>End time</th><td>{{job.end_time}}</td></tr>
|
||||
</table>
|
||||
|
||||
<h2 class="subtitle">Excution log:</h2>
|
||||
<pre>{{job.log}}</pre>
|
||||
</section>
|
||||
<script>
|
||||
(function() {
|
||||
var app = new Vue({
|
||||
el: '#job',
|
||||
data: {
|
||||
job: {}
|
||||
},
|
||||
})
|
||||
|
||||
ws = new WebSocket('ws://' + document.domain + ':' + location.port + '/job-%s-ws');
|
||||
|
||||
ws.onmessage = function (event) {
|
||||
var message = JSON.parse(event.data);
|
||||
var data = message.data;
|
||||
var action = message.action;
|
||||
|
||||
if (action == "init_job" || action == "update_job") {
|
||||
app.job = data;
|
||||
}
|
||||
};
|
||||
})()
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
Loading…
Add table
Reference in a new issue