feat(problemset): move hardness filter to right side and improve UX
- Relocate hardness dropdown from left to right side of filter controls - Change form submission behavior to update URL parameters directly - Preserve selected hardness value on page reload - Remove page parameter when hardness changes to reset pagination - Improve visual alignment and spacing in filter interface
This commit is contained in:
@@ -17,26 +17,6 @@
|
|||||||
<div class="results" style="width: 100%; "></div>
|
<div class="results" style="width: 100%; "></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="ui selection dropdown" style="width: 120px; height: 28px; margin-top: -5.3px; float:left; margin-right: 10px;">
|
|
||||||
<input type="hidden" name="hardness" value="<?php
|
|
||||||
$selected_hardness = 0;
|
|
||||||
if (isset($_GET['hardness'])) {
|
|
||||||
$selected_hardness = intval($_GET['hardness']);
|
|
||||||
if ($selected_hardness < 1 || $selected_hardness > 8)
|
|
||||||
$selected_hardness = 0;
|
|
||||||
}
|
|
||||||
echo $selected_hardness;
|
|
||||||
?>">
|
|
||||||
<i class="dropdown icon"></i>
|
|
||||||
<div class="default text">难度</div>
|
|
||||||
<div class="menu">
|
|
||||||
<div class="item" data-value="0">全部难度</div>
|
|
||||||
<?php for ($h = 1; $h <= 8; $h++) {
|
|
||||||
echo '<div class="item" data-value="' . $h . '">难度 ' . $h . '</div>';
|
|
||||||
} ?>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<?php if (isset($_SESSION[$OJ_NAME . '_' . 'administrator'])): ?>
|
<?php if (isset($_SESSION[$OJ_NAME . '_' . 'administrator'])): ?>
|
||||||
<div class="ui search" style="width: 120px; height: 28px; margin-top: -5.3px; display: inline-block;">
|
<div class="ui search" style="width: 120px; height: 28px; margin-top: -5.3px; display: inline-block;">
|
||||||
<div class="ui icon input" style="width: 100%; ">
|
<div class="ui icon input" style="width: 100%; ">
|
||||||
@@ -119,23 +99,48 @@
|
|||||||
</script>
|
</script>
|
||||||
<label>显示已正确题目</label>
|
<label>显示已正确题目</label>
|
||||||
</div>
|
</div>
|
||||||
<div style="margin-left: 10px; display: inline-block; ">
|
|
||||||
<a style="margin-left: 10px; " href="category.php" class="ui labeled icon mini green button"><i
|
|
||||||
class="plus icon"></i> <?php echo $MSG_SHOW_ALL_TAGS; ?></a>
|
|
||||||
|
|
||||||
|
<?php
|
||||||
|
$selected_hardness = 0;
|
||||||
|
if (isset($_GET['hardness'])) {
|
||||||
|
$selected_hardness = intval($_GET['hardness']);
|
||||||
|
if ($selected_hardness < 1 || $selected_hardness > 8)
|
||||||
|
$selected_hardness = 0;
|
||||||
|
}
|
||||||
|
?>
|
||||||
|
<div class="ui selection dropdown" id="hardness_dropdown" style="width: 120px; height: 28px; margin-left: 10px; vertical-align: middle;">
|
||||||
|
<input type="hidden" id="hardness_value" value="<?php echo $selected_hardness; ?>">
|
||||||
|
<i class="dropdown icon"></i>
|
||||||
|
<div class="default text">难度</div>
|
||||||
|
<div class="menu">
|
||||||
|
<div class="item" data-value="0">全部难度</div>
|
||||||
|
<?php for ($h = 1; $h <= 8; $h++) {
|
||||||
|
echo '<div class="item" data-value="' . $h . '">难度 ' . $h . '</div>';
|
||||||
|
} ?>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
$(function () {
|
$(function () {
|
||||||
$('.ui.dropdown').dropdown({
|
$('#hardness_dropdown').dropdown({
|
||||||
onChange: function () {
|
onChange: function (value) {
|
||||||
$(this).closest('form').submit();
|
var params = new URLSearchParams(window.location.search);
|
||||||
|
if (value == '0' || value === '') {
|
||||||
|
params.delete('hardness');
|
||||||
|
} else {
|
||||||
|
params.set('hardness', value);
|
||||||
|
}
|
||||||
|
params.delete('page');
|
||||||
|
window.location.href = '?' + params.toString();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
var hv = $('#hardness_value').val();
|
||||||
|
if (hv && hv !== '0') {
|
||||||
|
$('#hardness_dropdown').dropdown('set selected', hv);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user