dm-design/new_web/merchant/js/member-view.js

207 lines
6.2 KiB
JavaScript

/**
* 会员查看页面功能
* 会员列表的查看、筛选和分页功能
*/
// 页面初始化函数(必需)
function initMemberView() {
console.log('会员查看页面已初始化');
loadMemberViewCSS();
initMemberTable();
bindMemberEvents();
}
// 加载专用CSS
function loadMemberViewCSS() {
if (!document.getElementById('memberViewCSS')) {
const link = document.createElement('link');
link.id = 'memberViewCSS';
link.rel = 'stylesheet';
link.href = 'css/member-view.css';
document.head.appendChild(link);
}
}
// 初始化会员表格
function initMemberTable() {
const selectAllCheckbox = document.getElementById('selectAll');
if (selectAllCheckbox) {
selectAllCheckbox.addEventListener('change', toggleSelectAll);
}
}
// 绑定事件
function bindMemberEvents() {
// 筛选查询按钮事件已在HTML中绑定onclick
// 分页大小改变事件
const pageSizeSelect = document.getElementById('pageSize');
if (pageSizeSelect) {
pageSizeSelect.addEventListener('change', handlePageSizeChange);
}
}
// 全选切换
function toggleSelectAll() {
const selectAllCheckbox = document.getElementById('selectAll');
const memberCheckboxes = document.querySelectorAll('#memberTableBody input[type="checkbox"]');
memberCheckboxes.forEach(checkbox => {
checkbox.checked = selectAllCheckbox.checked;
});
}
// 筛选查询功能
function searchMembers() {
const storeFilter = document.getElementById('storeFilter').value;
const nicknameFilter = document.getElementById('nicknameFilter').value;
const levelFilter = document.getElementById('levelFilter').value;
const registrationDate = document.getElementById('registrationDate').value;
console.log('筛选条件:', {
store: storeFilter,
nickname: nicknameFilter,
level: levelFilter,
date: registrationDate
});
// 这里实现筛选逻辑
filterMemberTable(storeFilter, nicknameFilter, levelFilter, registrationDate);
}
// 筛选表格数据
function filterMemberTable(store, nickname, level, date) {
const tableBody = document.getElementById('memberTableBody');
const rows = tableBody.querySelectorAll('tr');
rows.forEach(row => {
let showRow = true;
// 店铺筛选
if (store && row.cells[1].textContent !== store) {
showRow = false;
}
// 昵称筛选
if (nickname && !row.cells[4].textContent.toLowerCase().includes(nickname.toLowerCase())) {
showRow = false;
}
// 等级筛选
if (level && !row.cells[6].textContent.includes(level)) {
showRow = false;
}
// 日期筛选(简单日期匹配)
if (date && !row.cells[8].textContent.includes(date)) {
showRow = false;
}
row.style.display = showRow ? '' : 'none';
});
}
// 查看会员详情
function viewMemberDetail(memberId) {
console.log('查看会员详情:', memberId);
// 先加载会员详情模块
loadMemberDetailModule().then(() => {
// 调用会员详情模块的函数
if (window.viewMemberDetail_Detail) {
window.viewMemberDetail_Detail(memberId);
} else {
console.error('会员详情模块未正确加载');
alert('页面加载失败,请重试');
}
}).catch(error => {
console.error('加载会员详情模块失败:', error);
alert('页面加载失败,请重试');
});
}
// 动态加载会员详情模块
async function loadMemberDetailModule() {
// 检查是否已经加载
if (window.memberDetailModuleLoaded) {
return Promise.resolve();
}
return new Promise((resolve, reject) => {
const script = document.createElement('script');
script.src = 'js/member-detail.js';
script.onload = () => {
window.memberDetailModuleLoaded = true;
resolve();
};
script.onerror = () => {
reject(new Error('Failed to load member-detail.js'));
};
document.head.appendChild(script);
});
}
// 处理分页大小改变
function handlePageSizeChange() {
const pageSize = document.getElementById('pageSize').value;
console.log('分页大小改为:', pageSize);
// 这里实现分页逻辑
// 实际项目中会重新请求数据或重新分页显示
}
// 排序功能
function sortTable(columnIndex, sortType = 'asc') {
const table = document.querySelector('.member-table');
const tbody = table.querySelector('tbody');
const rows = Array.from(tbody.querySelectorAll('tr'));
rows.sort((a, b) => {
const aValue = a.cells[columnIndex].textContent.trim();
const bValue = b.cells[columnIndex].textContent.trim();
if (sortType === 'asc') {
return aValue.localeCompare(bValue, 'zh-CN');
} else {
return bValue.localeCompare(aValue, 'zh-CN');
}
});
// 重新插入排序后的行
rows.forEach(row => tbody.appendChild(row));
}
// 重置筛选条件
function resetFilters() {
document.getElementById('storeFilter').value = '';
document.getElementById('nicknameFilter').value = '';
document.getElementById('levelFilter').value = '';
document.getElementById('registrationDate').value = '';
// 显示所有行
const tableBody = document.getElementById('memberTableBody');
const rows = tableBody.querySelectorAll('tr');
rows.forEach(row => {
row.style.display = '';
});
}
// 暴露到全局作用域供HTML调用
window.searchMembers = searchMembers;
window.viewMemberDetail = viewMemberDetail;
window.resetFilters = resetFilters;
window.sortTable = sortTable;
// 页面清理函数(可选)
function cleanupMemberView() {
// 清理事件监听器等
const selectAllCheckbox = document.getElementById('selectAll');
if (selectAllCheckbox) {
selectAllCheckbox.removeEventListener('change', toggleSelectAll);
}
const pageSizeSelect = document.getElementById('pageSize');
if (pageSizeSelect) {
pageSizeSelect.removeEventListener('change', handlePageSizeChange);
}
}