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; |