related to #1834 implemented badge on filter button

This commit is contained in:
MatthieuLP
2022-12-20 14:21:23 +01:00
parent 07ef2e0033
commit aa4ee2ca89
2 changed files with 41 additions and 1 deletions

View File

@@ -620,7 +620,7 @@ function advanced_filter_button_click() {
} else {
advanced_filter_hide();
}
update_user_list();
// update_user_list();
}
function advanced_filter_show() {
@@ -1465,6 +1465,15 @@ function update_guest_info() {
}
function update_user_list() {
let nb_filters = 0;
($(".advanced-filter-select[name=filter_status]").val() != "") ? nb_filters += 1 : false;
($(".advanced-filter-select[name=filter_group]").val() != "") ? nb_filters += 1 : false;
($(".advanced-filter-select[name=filter_level]").val() != "") ? nb_filters += 1 : false;
($(".dates-select-bar .slider-bar-container").slider("option", "values")[0] != 0) ? nb_filters += 1 : false;
($(".dates-select-bar .slider-bar-container").slider("option", "values")[1] != register_dates.length -1) ? nb_filters += 1 : false;
show_filter_infos(nb_filters);
let update_data = {
display: "all",
order: "id",
@@ -1593,3 +1602,17 @@ function delete_user(uid) {
}
})
}
function show_filter_infos(nb_filters) {
if (nb_filters != 0) {
$(".advanced-filter-btn").css({
width: "80px",
});
$(".filter-counter").html(nb_filters).css('display', 'flex');
} else {
$(".advanced-filter-btn").css({
width: "70px",
});
$(".filter-counter").css('display', 'none').html(0);
}
}

View File

@@ -234,6 +234,7 @@ $(document).ready(function() {
</div>
<div class="advanced-filter-btn icon-filter">
<span>{'Filters'|@translate}</span>
<span class="filter-counter">2</span>
</div>
<div id='search-user'>
<div class='search-info'> </div>
@@ -1949,6 +1950,9 @@ Advanced filter
position: absolute;
right: 650px;
margin-right:10px;
display: flex;
justify-content: center;
}
#search-user {
@@ -2409,4 +2413,17 @@ Advanced filter
.notClickableBefore:before {
color: #bbb;
}
.filter-counter {
background: #ffa500;
border-radius: 50%;
justify-content: center;
font-size: 10px;
padding: 1px 6px;
color: black;
margin:0 4px 0 7px;
display: none;
}
</style>