EARSystem

(() => {
    let items = [], filter = 'all';
    const list = document.getElementById('favorite-list');
    function render() {
        const shown = items.filter(x => filter === 'all' || (filter === 'visited' ? x.visited : !x.visited));
        list.innerHTML = shown.length ? shown.map(x => '<article class="panel favorite-card"><div class="place-art category-' + x.category + '">' + EAR.icons[x.category] + '</div><div class="card-top"><span class="pill">' + (x.visited ? '去过' : '想去') + '</span><span class="muted small">' + (x.source === 'Demo' ? '演示数据' : '独立采集') + '</span></div><h3><a href="/Places/' + x.placeId + '">' + EAR.escape(x.name) + '</a></h3><p class="muted small">' + EAR.labels[x.category] + ' · ' + EAR.price(x.price) + '</p><div class="card-actions"><a class="text-button" href="/Experiences?placeId=' + x.placeId + '">记录体验</a><button class="text-button danger-text" data-remove="' + x.placeId + '">取消收藏</button></div></article>').join('')
            : '<article class="panel empty-state"><span>♡</span><p>给下一次出发，留一点期待。</p><a href="/Nearby" class="text-button">去发现适合你的地方 ↗</a></article>';
    }
    document.getElementById('favorite-filter').addEventListener('click', e => { const b=e.target.closest('[data-filter]'); if(!b)return; filter=b.dataset.filter; document.querySelectorAll('[data-filter]').forEach(x=>x.classList.toggle('active',x===b)); render(); });
    list.addEventListener('click', async e => {
        const button = e.target.closest('[data-remove]'); if(!button)return;
        try { await EAR.api('/api/favorites/' + button.dataset.remove,'DELETE'); items=items.filter(x=>x.placeId!==button.dataset.remove); render(); EAR.toast('已取消收藏'); }
        catch(error) { EAR.toast(error.message,true); }
    });
    EAR.api('/api/favorites').then(data=>{items=data;render();}).catch(error=>{list.innerHTML='<div class="error-box">'+EAR.escape(error.message)+'</div>';});
})();