Table-bootstrap in report

This commit is contained in:
2023-06-06 23:57:18 +02:00
parent 8c576f8f2c
commit 3b458eab08
6 changed files with 71 additions and 19 deletions

Binary file not shown.

View File

@@ -51,20 +51,55 @@
</thead>
</table>
<div>{{ excel_button([ file ]) }}</div>
<table id="report-table"
class="table table-striped table-hover table-bordered bg-light">
<table class="table table-striped table-hover table-bordered bg-light"
id="table-report"
data-toggle="table"
data-sticky-header="true"
data-sticky-header-offset-y="50"
data-sortable="true">
<thead>
<tr class="bg-primary text-white">
<th class="text-center">Dataset</th>
<th class="text-center">Samples</th>
<th class="text-center">Features</th>
<th class="text-center">Classes</th>
<th class="text-center">Nodes</th>
<th class="text-center" colspan="2">{{ data.score_name|capitalize }}</th>
<th class="text-center">Time</th>
<th class="text-center">hyperparameters</th>
<th class="text-center" data-field="dataset" data-sortable="true">Dataset</th>
<th class="text-center"
data-field="samples"
data-sortable="true"
data-sorter="remove_dot">Samples</th>
<th class="text-center"
data-field="features"
data-sortable="true"
data-sorter="remove_dot">Features</th>
<th class="text-center"
data-field="classes"
data-sortable="true"
sdata-orter="remove_dot">Classes</th>
<th class="text-center"
data-field="nodes"
data-sortable="true"
data-sorter="remove_dot">Nodes</th>
<th class="text-center"
data-field="score"
data-sortable="true"
data-sorter="remove_plus">{{ data.score_name|capitalize }}</th>
<th class="text-center"></th>
<th class="text-center"
data-field="time"
data-sortable="true"
data-sorter="remove_plus">Time</th>
<th class="text-center" data-field="hyperparameters" data-sortable="true">hyperparameters</th>
</tr>
</thead>
<script>
function remove_plus(a, b) {
var aa = a.split('±')[0]
var bb = b.split('±')[0]
return aa - bb
}
function remove_dot(a, b) {
var aa = a.replace(',', '').replace('.', '')
var bb = b.replace(',', '').replace('.', '')
return aa - bb
}
</script>
<tbody>
{% for item in data.results %}
<tr>

View File

@@ -1,9 +1,29 @@
{% extends "base.html" %}
{% block styles %}
{{ super() }}
<link rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.7.2/font/bootstrap-icons.css">
<link rel="stylesheet"
href="https://unpkg.com/bootstrap-table@1.21.4/dist/bootstrap-table.min.css">
<link href="https://unpkg.com/bootstrap-table@1.21.4/dist/extensions/sticky-header/bootstrap-table-sticky-header.css"
rel="stylesheet">
{% endblock %}
{% block content %}
{% include "_table_report.html" %}
<table data-url="https://examples.wenzhixin.net.cn/examples/bootstrap_table/data">
<thead>
<tr>
<th data-field="id">ID</th>
<th data-field="name">Item Name</th>
<th data-field="price" data-sortable="true">Item Price</th>
</tr>
</thead>
</table>
{% endblock %}
{% block jscript %}
{{ super() }}
<script src="https://unpkg.com/bootstrap-table@1.21.4/dist/bootstrap-table.min.js"></script>
<script src="https://unpkg.com/bootstrap-table@1.21.4/dist/extensions/sticky-header/bootstrap-table-sticky-header.min.js"></script>
<script src="{{ url_for('static', filename="js/report.js") }}"></script>
<script src="{{ url_for('static', filename="js/excelFiles.js") }}"></script>
{% endblock %}

View File

@@ -31,6 +31,7 @@ tbody {
body {
padding-bottom: 20px;
padding-top: 60px;
background-color: #ffb878;
}
@@ -38,15 +39,11 @@ body {
margin-bottom: 20px;
}
pre {
background: #ddd;
padding: 10px;
}
h2 {
margin-top: 20px;
}
footer {
margin: 20px;
}

View File

@@ -14,4 +14,4 @@ $(document).ready(function () {
$(document).ajaxStop(function(){
$("body").removeClass('ajaxLoading');
});
});
});

View File

@@ -1,5 +1,5 @@
{% from 'bootstrap5/nav.html' import render_nav_item %}
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container-fluid">
<a class="navbar-brand" href="{{ url_for("main.index") }}">Benchmark</a>
<button class="navbar-toggler"