Settings filter v0.3 🔍

This commit is contained in:
jokob-sk
2024-04-25 18:05:16 +10:00
parent 294518b146
commit c11deeb57f
3 changed files with 58 additions and 25 deletions

View File

@@ -910,27 +910,45 @@ input[readonly] {
.settings-sticky-bottom-section {
position: fixed;
z-index: 999;
background-color: #2d2d2d;
opacity: 0.8;
background-color: #5B5B66;
/* opacity: 0.8; */
bottom: 30px;
border-radius: 5px;
margin:1px;
border-width: 1px;
border-style: solid;
border-color: inherit;
width: 87%;
}
.settings-sticky-bottom-section:hover {
opacity: 1;
border-color: #000;
}
.clear-filter
{
opacity: 0.5;
cursor: pointer;
width: 14px;
position: absolute;
right: -6px;
top: 6px;
}
.clear-filter:hover
{
opacity: 1;
}
.saveSettingsWrapper button
{
width:70%;
margin-top:20px;
margin-left:15%;
margin-bottom:20px;
}
/* ----------------------------------------------------------------- */
/* Devices page */
/* ----------------------------------------------------------------- */

View File

@@ -260,6 +260,12 @@ function initListInteractionOptions(selectorId) {
// -------------------------------------------------------------------
// Function to filter rows based on input text
function filterRows(inputText) {
if(!inputText)
{
inputText = ''
}
$('.table_row').each(function() {
// Check if the row id ends with '__metadata'
var idAttribute = $(this).attr('id');
@@ -283,6 +289,9 @@ setTimeout(() => {
// Event listener for input change
$('#settingsSearch').on('input', function() {
var searchText = $(this).val();
// hide the setting overview dashboard
$('#settingsOverview').collapse('hide');
filterRows(searchText);
});

View File

@@ -92,14 +92,19 @@ while ($row = $result -> fetchArray (SQLITE3_ASSOC)) {
</section>
<section class="content-header">
<div id="settingsOverview" class ="bg-white color-palette box panel panel-default col-sm-12 box-default box-info" >
<div class ="bg-white color-palette box panel panel-default col-sm-12 box-default box-info panel panel-default panel-title" >
<!-- Settings imported time -->
<div class ="settings-group col-sm-12">
<i class="<?= lang("settings_enabled_icon");?>"></i> <?= lang("settings_enabled");?>
</div>
<div class =" col-sm-12" id=""></div>
<a data-toggle="collapse" href="#settingsOverview">
<div class ="settings-group col-sm-12 panel-heading panel-title">
<i class="<?= lang("settings_enabled_icon");?>"></i> <?= lang("settings_enabled");?>
</div>
</a>
<div id="settingsOverview" class="panel-collapse collapse in">
<div class="panel-body"></div>
<div class =" col-sm-12" id=""></div>
</div>
</section>
@@ -147,26 +152,27 @@ while ($row = $result -> fetchArray (SQLITE3_ASSOC)) {
<!-- /.content -->
<section class=" settings-sticky-bottom-section col-sm-12">
<div class="col-sm-5 settingsSearchWrap form-group has-success bg-white color-palette ">
<div class ="col-sm-12">
<section class=" settings-sticky-bottom-section col-sm-10">
<div class="col-sm-8 settingsSearchWrap form-group has-success bg-white color-palette ">
<div class ="col-sm-8">
<i class="fa-solid fa-filter"></i> <?= lang("Gen_Filter");?>
</div>
<div class ="col-sm-12">
<div class ="col-sm-11">
<input type="text" id="settingsSearch" class="form-control input-sm col-sm-7" placeholder="Filter Settings...">
</div>
<div class ="col-sm-1 clear-filter">
<i class="fa-solid fa-circle-xmark" onclick="$('#settingsSearch').val('')"></i>
</div>
<div class ="col-sm-12">
<input type="text" id="settingsSearch" class="form-control input-sm col-sm-12" placeholder="Filter Settings...">
<div class="clear-filter ">
<i class="fa-solid fa-circle-xmark" onclick="$('#settingsSearch').val('');filterRows();$('#settingsSearch').focus()"></i>
</div>
</div>
</div>
<div class="col-sm-5">
<button type="button" class="center top-margin btn btn-primary btn-default pa-btn bg-green" id="save" onclick="saveSettings()"><?= lang('DevDetail_button_Save');?></button>
</div>
<div id="result"></div>
<div class="col-sm-4 saveSettingsWrapper">
<button type="button" class=" btn btn-primary btn-default pa-btn bg-green" id="save" onclick="saveSettings()"><?= lang('DevDetail_button_Save');?></button>
</div>
<div id="result"></div>
</section>
</div>
@@ -260,7 +266,7 @@ while ($row = $result -> fetchArray (SQLITE3_ASSOC)) {
index++;
});
$('#settingsOverview').append(overviewSections_html);
$('#settingsOverview .panel-body').append(overviewSections_html);
// Display warning
if(schedulesAreSynchronized(enabledDeviceScanners, pluginsData) == false)