sporada/nopaque
1
0
Fork 0
mirror of https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque.git synced 2025-11-04 04:12:45 +00:00
Code Issues Projects Releases Wiki Activity

Make admin user list sortable.

Browse Source
This commit is contained in:
Stephan Porada
2019-09-09 15:02:17 +02:00
parent dc975935ca
commit 7775954123
3 changed files with 98 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
app/static/css/opaque.css
View File

@@ -33,3 +33,43 @@ main {
} }
} }
/* ### End sidenav-fixed offset ### */ /* ### End sidenav-fixed offset ### */
/* CSS for clickable th elements in tables. Needed for sortable table data with
list js. On click on th header elements will be sorted accordingly. Also a caret
indicator will show up how the column is sorted right now.; */
.sort {
cursor: pointer;
}
.sort:after {
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-bottom: 5px solid transparent;
content:"";
position: relative;
top:-10px;
right:-5px;
}
.sort.asc:after {
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 5px solid #000000;
content:"";
position: relative;
top:13px;
right:-5px;
}
.sort.desc:after {
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-bottom: 5px solid #000000;
content:"";
position: relative;
top:-10px;
right:-5px;
}

24
app/tables.py
View File

@@ -6,14 +6,24 @@ class AdminUserTable(Table):
Declares the table describing colum by column. Declares the table describing colum by column.
""" """
classes = ['highlight', 'responsive-table'] classes = ['highlight', 'responsive-table']
username = Col('Username', column_html_attrs={'class': 'username'}) username = Col('Username', column_html_attrs={'class': 'username'},
email = Col('Email', column_html_attrs={'class': 'email'}) th_html_attrs={'class': 'sort',
role_id = Col('Role', column_html_attrs={'class': 'role'}) 'data-sort': 'username'})
confirmed = Col('Confrimed Status', column_html_attrs={'class': 'confirmed'}) email = Col('Email', column_html_attrs={'class': 'email'},
id = Col('User Id', column_html_attrs={'class': 'id'}) th_html_attrs={'class': 'sort',
'data-sort': 'email'})
role_id = Col('Role', column_html_attrs={'class': 'role'},
th_html_attrs={'class': 'sort',
'data-sort': 'role'})
confirmed = Col('Confrimed Status', column_html_attrs={'class': 'confirmed'},
th_html_attrs={'class': 'sort',
'data-sort': 'confirmed'})
id = Col('User Id', column_html_attrs={'class': 'id'},
th_html_attrs={'class': 'sort',
'data-sort': 'id'})
url = LinkCol('Profile', 'admin.admin_user_page', url = LinkCol('Profile', 'admin.admin_user_page',
url_kwargs=dict(user_id='id'), url_kwargs=dict(user_id='id'),
anchor_attrs={'class': 'waves-effect waves-light btn-small'}) anchor_attrs={'class': 'waves-effect waves-light btn-small'})
class AdminUserItem(object): class AdminUserItem(object):

44
app/templates/admin/admin.html.j2
View File

@@ -1,8 +1,46 @@
{% extends "base.html.j2" %} {% extends "base.html.j2" %}
{% block page_content %} {% block page_content %}
<style media="screen">
.sort {
cursor: pointer;
}
.sort:after {
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-bottom: 5px solid transparent;
content:"";
position: relative;
top:-10px;
right:-5px;
}
.sort.asc:after {
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 5px solid #000000;
content:"";
position: relative;
top:13px;
right:-5px;
}
.sort.desc:after {
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-bottom: 5px solid #000000;
content:"";
position: relative;
top:-10px;
right:-5px;
}
</style>
<div class="col s12"> <div class="col s12">
<div class="card large"> <div class="card">
<div class="card-content"> <div class="card-content">
<span class="card-title">User list</span> <span class="card-title">User list</span>
<div id="users"> <div id="users">
@@ -19,8 +57,8 @@
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
var options = { var options = {
valueNames: ['username', 'email', 'role', 'confirmed'], valueNames: ['username', 'email', 'role', 'confirmed', 'id'],
page: 3, page: 10,
pagination: true pagination: true
}; };
var userList = new List('users', options); var userList = new List('users', options);