查看“Widget:DynFilterOld”的源代码

<includeonly><script>
// widget用的配置对象，暂时注释，不要删除
const WIKINAME_CardSelectExt = RLCONF.wgGameName;
const CONFIG = {
    storageKey: `<!--{$storageKey}-->` || 'achievementCompletion',  // localStorage的key
    completionParamName: `<!--{$param}-->` || 'param3',  // 存储完成状态的data-param名
    states: {
        completed: `<!--{$completed}-->` || '完成',
        uncompleted: `<!--{$uncompleted}-->` || '未完成'
    }
};

// 本地测试用的配置对象
// const CONFIG = {
//     storageKey: 'achievementCompletion',  // localStorage的key
//     completionParamName: 'param3',  // 存储完成状态的data-param名
//     states: {
//         completed: '完成',
//         uncompleted: '未完成'
//     }
// };

// 更新成就统计数据
function updateAchievementStats() {
    const rows = document.querySelectorAll('.divsort');
    const total = rows.length;
    const finished = Array.from(rows).filter(row => 
        row.dataset[CONFIG.completionParamName] === CONFIG.states.completed
    ).length;
    const unfinished = total - finished;
    
    document.getElementById('DynFilterCalc-finished').textContent = finished;
    document.getElementById('DynFilterCalc-all').textContent = total;
    document.getElementById('DynFilterCalc-unFinish').textContent = unfinished;
}

// 保存完成状态到localStorage
function saveCompletionState() {
    const completionState = {};
    document.querySelectorAll('.divsort').forEach(row => {
        completionState[row.dataset.collection] = row.dataset[CONFIG.completionParamName];
    });
    localStorage.setItem(CONFIG.storageKey, JSON.stringify(completionState));
}

// 从localStorage加载完成状态
function loadCompletionState() {
    const savedState = localStorage.getItem(CONFIG.storageKey);
    if (savedState) {
        const completionState = JSON.parse(savedState);
        document.querySelectorAll('.divsort').forEach(row => {
            const savedStatus = completionState[row.dataset.collection];
            if (savedStatus) {
                row.dataset[CONFIG.completionParamName] = savedStatus;
            }
        });
    }
}

// 初始化勾选框
function initCheckboxes() {
    loadCompletionState();
    updateAchievementStats();
    
    const rows = document.querySelectorAll('.divsort');
    rows.forEach(row => {
        const firstCell = row.querySelector('td:first-child');
        const checkbox = document.createElement('span');
        checkbox.className = 'achievement-checkbox';
        
        if (row.dataset[CONFIG.completionParamName] === CONFIG.states.completed) {
            checkbox.classList.add('checked');
        }
        
        // 勾选框点击事件
        checkbox.addEventListener('click', (e) => {
            e.stopPropagation();
            checkbox.classList.toggle('checked');
            const newState = checkbox.classList.contains('checked') 
                ? CONFIG.states.completed 
                : CONFIG.states.uncompleted;
            
            // 更新数据状态
            row.dataset[CONFIG.completionParamName] = newState;
            
            // 保存到本地存储
            saveCompletionState();
            
            // 更新统计
            updateAchievementStats();
            
            // 触发 CardSelectTr.js 的更新
            if (typeof updateFilterData === 'function') {
                updateFilterData();
            }
        });
        
        firstCell.insertBefore(checkbox, firstCell.firstChild);
        
        // 整行点击事件
        row.addEventListener('click', (e) => {
            if (e.target.closest('a') || e.target === checkbox) {
                return;
            }
            
            checkbox.click(); // 触发勾选框的点击事件
        });
    });
}

// 勾选所有/重置所有功能
function checkAll(checked) {
    const checkboxes = document.querySelectorAll('.achievement-checkbox');
    checkboxes.forEach(checkbox => {
        const row = checkbox.closest('.divsort');
        if (checked) {
            checkbox.classList.add('checked');
        } else {
            checkbox.classList.remove('checked');
        }
        row.dataset[CONFIG.completionParamName] = checked 
            ? CONFIG.states.completed 
            : CONFIG.states.uncompleted;
    });
    
    saveCompletionState();
    updateAchievementStats();
    
    // 触发 CardSelectTr.js 的更新
    if (typeof updateFilterData === 'function') {
        updateFilterData();
    }
}

// 初始化事件监听
function initEvents() {
    // 勾选所有按钮
    document.querySelector('.dynFilterBt-all').addEventListener('click', () => {
        if (confirm('确定要将所有内容标记为已完成吗？(包括未筛选的)')) {
            checkAll(true);
        }
    });

    // 重置所有按钮
    document.querySelector('.dynFilterBt-reset').addEventListener('click', () => {
        if (confirm('确定要将所有内容重置为未完成吗？(包括未筛选的)')) {
            checkAll(false);
        }
    });
}

// 页面加载完成后初始化
document.addEventListener('DOMContentLoaded', () => {
    initCheckboxes();
    initEvents();
});
  </script>
</includeonly><noinclude>
<pre>const CONFIG = {
    storageKey: `<!--{$storageKey}-->` || 'achievementCompletion',  // localStorage的key
    completionParamName: `<!--{$param}-->` || 'param3',  // 存储完成状态的data-param名
    states: {
        completed: `<!--{$completed}-->` || '完成',
        uncompleted: `<!--{$uncompleted}-->` || '未完成'
    }
};</pre>
</noinclude>