UMS-Agenten/Agenten-Plattform
3
0
Fork 0
Code Issues Actions Packages Releases Activity

Table works

Browse Source
This commit is contained in:
Magnus Bender
2024-10-09 15:13:40 +02:00
parent a4d0803d20
commit 4199b1c347
7 changed files with 183 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
web/public/static/main.css
View File

@ -0,0 +1,4 @@
.value_filter {
width: 150px;
}

37
web/public/static/main.js
View File

@ -0,0 +1,37 @@
function pagination_link(name, value){
let link_args = db_args;
if (name && value){
link_args[name] = value;
}
else if(name){
delete link_args[name];
}
return '?' + $.param( link_args );
}
$(".value_filter").change((e)=>{
window.location = pagination_link($(e.target).attr('name').substr('filter_'.length), $(e.target).val())
});
function enable_auto_refresh(){
setInterval( () => {
if($('#autoRefresh').prop('checked')){
$.get(
'/app/table/total' + pagination_link(),
(v) => {
if( v != db_total ){
window.location = pagination_link()
}
}
);
}
}, 1000);
sessionStorage.setItem('auto_refresh', $('#autoRefresh').prop('checked'));
}
$("#autoRefresh").click(enable_auto_refresh);
if(sessionStorage.hasOwnProperty('auto_refresh') && sessionStorage.getItem('auto_refresh') === 'true'){
$("#autoRefresh").prop('checked', true);
enable_auto_refresh()
}

2
web/templates/base.html
View File

@ -18,7 +18,6 @@
<script src="/static/jquery.min.js"></script>
<script src="/static/bootstrap.bundle.min.js"></script>
<script src="/static/main.js"></script>
<title>{{title}} &ndash; MGMT</title>
@ -44,5 +43,6 @@
{% block maincontent %}
{% endblock %}
</div>
<script src="/static/main.js"></script>
</body>
</html>

78
web/templates/table.html
View File

@ -26,25 +26,35 @@
{% endmacro %}
{% block maincontent %}
<div class="float-end">
<a href="/app/new" class="btn btn-secondary">&rarr; Add a Riddle</a>
<div class="row">
<div class="col">
<div class="form-check form-switch">
<input class="form-check-input" type="checkbox" role="switch" id="autoRefresh">
<label class="form-check-label" for="autoRefresh">Refresh for new messages</label>
</div>
</div>
<div class="col">
{{pagination()}}
</div>
<div class="col">
<a href="/app/new" class="btn btn-secondary">&rarr; Add a Riddle</a>
</div>
</div>
{{pagination()}}
<table class="table table-striped">
<thead>
{% for item in db.iterate(**db_args) %}
{% set field_names = ['id'] + item.__fields__.keys()|list %}
{% if loop.index == 1 %}
<tr id="row_0">
{% for field in item.__fields__.keys() %}
{% for field in field_names %}
<th>
{% if field == 'time' %}
<input type="text" class="value_filter" name="filter_time_before" value="{{db_args.time_before}}" class="form-control" placeholder="Before">
<input type="text" class="value_filter" name="filter_time_after" value="{{db_args.time_after}}" class="form-control" placeholder="After">
<input type="text" class="value_filter" name="filter_time_before" value="{{timestamp2date(db_args.time_before)}}" class="form-control" placeholder="Before"><br />
<input type="text" class="value_filter" name="filter_time_after" value="{{timestamp2date(db_args.time_after)}}" class="form-control" placeholder="After"><br />
{% elif field not in ('message', 'count') %}
<input type="text" class="value_filter" name="filter_{{field}}" value="{{db_args[field]}}" class="form-control" placeholder="Filter">
<input type="text" class="value_filter" name="filter_{{field}}" value="{{db_args[field]}}" class="form-control" placeholder="Filter"><br />
{% endif %}
{{ field.title() }}
</th>
@ -54,7 +64,7 @@
{% endif %}
<tr id="row_{{loop.index}}">
{% for field in item.__fields__.keys() %}
{% for field in field_names %}
{% if field == "message" %}
<td>
<button type="button" class="btn btn-outline-secondary btn-outline" data-bs-toggle="modal" data-bs-target="#row_message_{{loop.index}}">
@ -74,6 +84,8 @@
</div>
</div>
</td>
{% elif field == "id" %}
<td>{{ item.message.id }}</td>
{% elif field == "time" %}
<td ts="item[field]">{{ timestamp2date(item[field]) }}</td>
{% else %}
@ -83,27 +95,43 @@
</tr>
{% else %}
<div class="alert alert-warning" role="alert">
No items found, reset offset, limit, filter, ...!
No items found, reset offset, limit, filter, ...!<br />
<a class="btn btn-warning" href="/app/table">Reset</a>
</div>
{% endfor %}
</tbody>
</table>
<div class="float-end">
<div class="input-group">
<label class="input-group-text" for="items-per-page">Items per page</label>
<select class="form-select" id="items-per-page" onchange="location = this.value;">
<option value="?{{ pagination_link(limit=5) }}" {% if db_args.limit == 5 %}selected{% endif %}>5</option>
<option value="?{{ pagination_link(limit=10) }}" {% if db_args.limit == 10 %}selected{% endif %}>10</option>
<option value="?{{ pagination_link(limit=25) }}" {% if db_args.limit == 25 %}selected{% endif %}>25</option>
<option value="?{{ pagination_link(limit=100) }}" {% if db_args.limit == 100 %}selected{% endif %}>100</option>
{% if db_args.limit not in (5, 10, 25, 100) %}
<option value="?{{ pagination_link(limit=db_args.limit) }}" selected>{{db_args.limit}}</option>
{% endif %}
</select>
<div class="row">
<div class="col">
{{pagination()}}
</div>
<div class="col">
<div class="input-group">
<label class="input-group-text" for="total-items">Total items</label>
<input class="form-control" id="total-items" disabled value="{{ db.len(**db_args) }}" />
</div>
</div>
<div class="col">
<div class="input-group">
<label class="input-group-text" for="items-per-page">Items per page</label>
<select class="form-select" id="items-per-page" onchange="window.location = this.value;">
<option value="?{{ pagination_link(limit=5) }}" {% if db_args.limit == 5 %}selected{% endif %}>5</option>
<option value="?{{ pagination_link(limit=10) }}" {% if db_args.limit == 10 %}selected{% endif %}>10</option>
<option value="?{{ pagination_link(limit=25) }}" {% if db_args.limit == 25 %}selected{% endif %}>25</option>
<option value="?{{ pagination_link(limit=100) }}" {% if db_args.limit == 100 %}selected{% endif %}>100</option>
{% if db_args.limit not in (5, 10, 25, 100) %}
<option value="?{{ pagination_link(limit=db_args.limit) }}" selected>{{db_args.limit}}</option>
{% endif %}
</select>
</div>
</div>
</div>
{{pagination()}}
{% endblock %}
{% block morehead %}
<script>
const db_args = JSON.parse('{{ db_args|tojson }}');
const db_total = {{ db.len(**db_args) }};
</script>
{% endblock %}