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:
2026-03-13 15:25:34 +08:00
parent 10278b55fb
commit 2a41341e51

View File

@@ -17,26 +17,6 @@
<div class="results" style="width: 100%; "></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'])): ?>
<div class="ui search" style="width: 120px; height: 28px; margin-top: -5.3px; display: inline-block;">
<div class="ui icon input" style="width: 100%; ">
@@ -119,23 +99,48 @@
</script>
<label>显示已正确题目</label>
</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>
<script>
$(function () {
$('.ui.dropdown').dropdown({
onChange: function () {
$(this).closest('form').submit();
$('#hardness_dropdown').dropdown({
onChange: function (value) {
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>