feat(dashboard): 尾号筛选改为可新增多行
- 点击新增按钮添加尾号下拉选择 - 支持添加多个尾号,任一选中即屏蔽 - 支持删除单个尾号行 - 重置清空所有尾号
This commit is contained in:
@@ -749,15 +749,11 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefin
|
|||||||
'<div style="margin-bottom:15px;display:flex;gap:15px;align-items:center;flex-wrap:wrap;">' +
|
'<div style="margin-bottom:15px;display:flex;gap:15px;align-items:center;flex-wrap:wrap;">' +
|
||||||
' <div class="form-group" style="margin:0;">' +
|
' <div class="form-group" style="margin:0;">' +
|
||||||
' <label>尾号筛选:</label>' +
|
' <label>尾号筛选:</label>' +
|
||||||
' <select id="nf-tail" class="form-control" style="width:100px;display:inline-block;">' +
|
' <button class="btn btn-xs btn-primary btn-nf-add-tail"><i class="fa fa-plus"></i> 新增</button>' +
|
||||||
' <option value="">全部</option>';
|
|
||||||
for (var t = 0; t <= 9; t++) {
|
|
||||||
html += '<option value="' + t + '">' + t + '</option>';
|
|
||||||
}
|
|
||||||
html += ' </select>' +
|
|
||||||
' </div>' +
|
' </div>' +
|
||||||
' <button class="btn btn-default btn-nf-reset" style="margin-left:auto;"><i class="fa fa-refresh"></i> 重置</button>' +
|
' <button class="btn btn-default btn-nf-reset" style="margin-left:auto;"><i class="fa fa-refresh"></i> 重置</button>' +
|
||||||
'</div>' +
|
'</div>' +
|
||||||
|
'<div id="nf-tail-list" style="margin-bottom:15px;display:flex;flex-wrap:wrap;gap:6px;"></div>' +
|
||||||
'<div style="margin-bottom:15px;">' +
|
'<div style="margin-bottom:15px;">' +
|
||||||
' <label style="margin-right:10px;">生肖:</label>' +
|
' <label style="margin-right:10px;">生肖:</label>' +
|
||||||
' <div id="nf-zodiac" style="display:inline-flex;gap:6px;flex-wrap:wrap;">' +
|
' <div id="nf-zodiac" style="display:inline-flex;gap:6px;flex-wrap:wrap;">' +
|
||||||
@@ -801,8 +797,18 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefin
|
|||||||
// 渲染号码网格
|
// 渲染号码网格
|
||||||
Controller.api.renderNumberFilterGrid(layero);
|
Controller.api.renderNumberFilterGrid(layero);
|
||||||
|
|
||||||
// 尾号下拉选择
|
// 新增尾号
|
||||||
$('#nf-tail', layero).on('change', function () {
|
$('.btn-nf-add-tail', layero).on('click', function () {
|
||||||
|
Controller.api.addTailRow(layero, 0);
|
||||||
|
Controller.api.applyNumberFilters(layero);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 尾号输入 & 删除事件委托
|
||||||
|
$('#nf-tail-list', layero).on('input change', '.nf-tail-select', function () {
|
||||||
|
Controller.api.applyNumberFilters(layero);
|
||||||
|
});
|
||||||
|
$('#nf-tail-list', layero).on('click', '.nf-tail-del', function () {
|
||||||
|
$(this).closest('.nf-tail-row').remove();
|
||||||
Controller.api.applyNumberFilters(layero);
|
Controller.api.applyNumberFilters(layero);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -846,7 +852,7 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefin
|
|||||||
|
|
||||||
// 重置按钮
|
// 重置按钮
|
||||||
$('.btn-nf-reset', layero).on('click', function () {
|
$('.btn-nf-reset', layero).on('click', function () {
|
||||||
$('#nf-tail', layero).val('');
|
$('#nf-tail-list', layero).html('');
|
||||||
$('.nf-zodiac', layero).removeClass('btn-gray').addClass('btn-default');
|
$('.nf-zodiac', layero).removeClass('btn-gray').addClass('btn-default');
|
||||||
$('.nf-color-btn', layero).removeClass('btn-gray').addClass('btn-default');
|
$('.nf-color-btn', layero).removeClass('btn-gray').addClass('btn-default');
|
||||||
$('#nf-range-list', layero).html('');
|
$('#nf-range-list', layero).html('');
|
||||||
@@ -856,6 +862,22 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefin
|
|||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 新增一行尾号筛选
|
||||||
|
*/
|
||||||
|
addTailRow: function (layero, value) {
|
||||||
|
var rowId = 'nf-tail-' + Date.now() + Math.random().toString(36).substr(2, 5);
|
||||||
|
var opts = '<option value="">尾号</option>';
|
||||||
|
for (var t = 0; t <= 9; t++) {
|
||||||
|
opts += '<option value="' + t + '"' + (t === value ? ' selected' : '') + '>' + t + '</option>';
|
||||||
|
}
|
||||||
|
var html = '<div class="nf-tail-row" id="' + rowId + '" style="display:inline-flex;align-items:center;gap:4px;">' +
|
||||||
|
' <select class="form-control nf-tail-select" style="width:80px;display:inline-block;">' + opts + '</select>' +
|
||||||
|
' <button class="btn btn-xs btn-danger nf-tail-del"><i class="fa fa-times"></i></button>' +
|
||||||
|
'</div>';
|
||||||
|
$('#nf-tail-list', layero).append(html);
|
||||||
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 新增一行区间筛选
|
* 新增一行区间筛选
|
||||||
*/
|
*/
|
||||||
@@ -899,7 +921,14 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefin
|
|||||||
* 应用筛号器过滤条件
|
* 应用筛号器过滤条件
|
||||||
*/
|
*/
|
||||||
applyNumberFilters: function (layero) {
|
applyNumberFilters: function (layero) {
|
||||||
var tailVal = $('#nf-tail', layero).val();
|
// 收集所有选中的尾号
|
||||||
|
var excludedTails = [];
|
||||||
|
$('.nf-tail-select', layero).each(function () {
|
||||||
|
var val = $(this).val();
|
||||||
|
if (val !== '' && excludedTails.indexOf(parseInt(val)) === -1) {
|
||||||
|
excludedTails.push(parseInt(val));
|
||||||
|
}
|
||||||
|
});
|
||||||
// 收集被点击(置灰)的生肖
|
// 收集被点击(置灰)的生肖
|
||||||
var excludedZodiacs = [];
|
var excludedZodiacs = [];
|
||||||
$('.nf-zodiac.btn-gray', layero).each(function () {
|
$('.nf-zodiac.btn-gray', layero).each(function () {
|
||||||
@@ -929,8 +958,8 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefin
|
|||||||
|
|
||||||
var hidden = false;
|
var hidden = false;
|
||||||
|
|
||||||
// 尾号筛选:选择了具体尾号则屏蔽该尾号
|
// 尾号筛选:选中多个尾号,任一命中即屏蔽
|
||||||
if (tailVal !== '' && parseInt(tailVal) === tail) {
|
if (excludedTails.length > 0 && excludedTails.indexOf(tail) !== -1) {
|
||||||
hidden = true;
|
hidden = true;
|
||||||
}
|
}
|
||||||
// 区间筛选:在区间=白名单(OR)、排除区间=黑名单(OR)
|
// 区间筛选:在区间=白名单(OR)、排除区间=黑名单(OR)
|
||||||
|
|||||||
Reference in New Issue
Block a user