104 lines
3.4 KiB
JavaScript
104 lines
3.4 KiB
JavaScript
|
|
/**
|
|||
|
|
* 等级设置页面功能模块
|
|||
|
|
* 包含多选下拉框功能
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
// 页面初始化函数
|
|||
|
|
function initLevelSettings() {
|
|||
|
|
console.log('等级设置页面已初始化');
|
|||
|
|
// 设置外部点击监听器
|
|||
|
|
setupOutsideClickListener();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 切换下拉框显示/隐藏
|
|||
|
|
function toggleDropdown() {
|
|||
|
|
const options = document.getElementById('stallOptions');
|
|||
|
|
const arrow = document.querySelector('.multiselect-arrow');
|
|||
|
|
|
|||
|
|
if (options && arrow) {
|
|||
|
|
if (options.classList.contains('show')) {
|
|||
|
|
options.classList.remove('show');
|
|||
|
|
arrow.classList.remove('rotated');
|
|||
|
|
} else {
|
|||
|
|
options.classList.add('show');
|
|||
|
|
arrow.classList.add('rotated');
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 全选/取消全选功能
|
|||
|
|
function selectAll(checkbox) {
|
|||
|
|
const allCheckboxes = document.querySelectorAll('#stallOptions input[type="checkbox"]:not([value="all"])');
|
|||
|
|
|
|||
|
|
if (checkbox.checked) {
|
|||
|
|
allCheckboxes.forEach(cb => cb.checked = true);
|
|||
|
|
} else {
|
|||
|
|
allCheckboxes.forEach(cb => cb.checked = false);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
updateSelection();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 更新选择状态和显示文本
|
|||
|
|
function updateSelection() {
|
|||
|
|
const allCheckbox = document.querySelector('input[value="all"]');
|
|||
|
|
const otherCheckboxes = document.querySelectorAll('#stallOptions input[type="checkbox"]:not([value="all"])');
|
|||
|
|
const selectedText = document.querySelector('.multiselect-selected');
|
|||
|
|
|
|||
|
|
if (!allCheckbox || !selectedText) return;
|
|||
|
|
|
|||
|
|
const checkedBoxes = Array.from(otherCheckboxes).filter(cb => cb.checked);
|
|||
|
|
const allChecked = checkedBoxes.length === otherCheckboxes.length;
|
|||
|
|
|
|||
|
|
// 更新"全部"复选框状态
|
|||
|
|
allCheckbox.checked = allChecked;
|
|||
|
|
|
|||
|
|
// 更新显示文本
|
|||
|
|
if (checkedBoxes.length === 0) {
|
|||
|
|
selectedText.textContent = '请选择摊位名称...';
|
|||
|
|
} else if (allChecked) {
|
|||
|
|
selectedText.textContent = '全部';
|
|||
|
|
} else if (checkedBoxes.length === 1) {
|
|||
|
|
selectedText.textContent = checkedBoxes[0].value;
|
|||
|
|
} else {
|
|||
|
|
selectedText.textContent = `已选择${checkedBoxes.length}个摊位`;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 点击外部关闭下拉框的事件监听器
|
|||
|
|
function setupOutsideClickListener() {
|
|||
|
|
document.addEventListener('click', function(event) {
|
|||
|
|
const container = document.querySelector('.multiselect-container');
|
|||
|
|
if (container && !container.contains(event.target)) {
|
|||
|
|
const options = document.getElementById('stallOptions');
|
|||
|
|
const arrow = document.querySelector('.multiselect-arrow');
|
|||
|
|
if (options && arrow) {
|
|||
|
|
options.classList.remove('show');
|
|||
|
|
arrow.classList.remove('rotated');
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 页面清理函数(当页面被关闭时调用)
|
|||
|
|
function cleanupLevelSettings() {
|
|||
|
|
// 移除事件监听器等清理工作
|
|||
|
|
console.log('等级设置页面已清理');
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 打开等级明细页面
|
|||
|
|
function openLevelDetails(merchantName) {
|
|||
|
|
// 打开新的tab页面显示该商户的等级明细
|
|||
|
|
const tabTitle = `${merchantName} - 等级设置明细`;
|
|||
|
|
if (typeof window.openTab === 'function') {
|
|||
|
|
window.openTab(tabTitle, 'level-details');
|
|||
|
|
} else {
|
|||
|
|
console.error('openTab函数未找到');
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 将函数暴露到全局作用域,以便HTML中的onclick可以调用
|
|||
|
|
window.toggleDropdown = toggleDropdown;
|
|||
|
|
window.selectAll = selectAll;
|
|||
|
|
window.updateSelection = updateSelection;
|
|||
|
|
window.openLevelDetails = openLevelDetails;
|