-
Notifications
You must be signed in to change notification settings - Fork 1
/
jobhist.html
115 lines (113 loc) · 4.07 KB
/
jobhist.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>Job history</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/[email protected]/themes/vue-tabs.css"
/>
<link
rel="stylesheet"
type="text/css"
href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css"
/>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/[email protected]/css/bulma.min.css"
/>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/[email protected]/css/dataTables.bulma.min.css"
/>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue-router/dist/vue-router.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue-tabs.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/axios.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue-axios.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/moment.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/lib/moment-duration-format.min.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/js/dataTables.bulma.min.js"></script>
<script src="https://cdn.datatables.net/plug-ins/1.10.16/sorting/any-number.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/lodash.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/mousetrap.min.js"></script>
<script src="./utils.js"></script>
</head>
<body>
<nav class="navbar is-transparent">
<div class="navbar-brand">
<p class="navbar-item">
<strong class="is-size-3">SLURM web interface</strong>
</p>
<a class="navbar-item" href="./squeue.html">SQUEUE</a>
<a class="navbar-item" href="./nodeinfo.html">NODEINFO</a>
</div>
</nav>
<div id="app">
<table id="jobhistory" class="table display nowrap"></table>
</div>
<script>
var router = new VueRouter({
mode: "history",
routes: []
});
new Vue({
router,
el: "#app",
data: {
jobhist: undefined,
user: undefined
},
mounted() {
this.user = this.$route.query.user;
axios
.get("../data/jobhist/" + this.user)
.then(response => (this.jobhist = response.data))
.finally(() => this.updateJobTable());
},
methods: {
updateJobTable() {
const headers = this.jobhist.headers;
const jobs = this.jobhist.jobs;
const cols = [];
for (const i in headers) {
if (headers.hasOwnProperty(i)) {
const h = headers[i];
cols.push({
title: h,
data: headers.indexOf(h),
className: "dt-body-right"
});
}
}
cols[cols.length - 1].className = "dt-body-left";
const jobhist = $("#jobhistory").DataTable({
data: jobs,
columns: cols,
order: [[0, "asc"]],
pageLength: 25,
lengthMenu: [[25, 50, 100, -1], [25, 50, 100, "All"]],
scrollX: true,
stateSave: true,
columnDefs: [
{
render: function(data, type, row) {
return (
"<a href=job.html?jobid=" + data + ">" + data + "</a>"
);
},
targets: 0
}
]
});
}
},
watch: {}
});
</script>
</body>
</html>