doodle-mini/miniprogram/pages/category/category.ts

import { CATEGORY_LIST_WITH_ALL } from '../../core/data/categories';
import { CATEGORY_DATA, type CategoryItem } from './category.data';

type CategoryTab = {
    id: string;
    name: string;
    icon: string;
};

const SIDEBAR_TABS: CategoryTab[] = CATEGORY_LIST_WITH_ALL.map(({ id, name, icon }) => ({
    id,
    name,
    icon,
}));

function buildAllItems(): CategoryItem[] {
    const items: CategoryItem[] = [];
    for (const group of CATEGORY_DATA.categories) {
        for (const item of group.items) {
            items.push({
                ...item,
            });
        }
    }
    return items;
}

function getItemsByCategory(categoryId: string): CategoryItem[] {
    if (categoryId === 'all') return buildAllItems();
    const group = CATEGORY_DATA.categories.find((c) => c.id === categoryId);
    if (!group) return [];
    return group.items.map((item) => ({
        ...item,
    }));
}

function filterByKeyword(
    items: CategoryItem[],
    keyword: string,
): CategoryItem[] {
    if (!keyword) return items;
    const kw = keyword.toLowerCase();
    return items.filter(
        (item) =>
            item.title.toLowerCase().includes(kw) ||
            item.subtitle.toLowerCase().includes(kw),
    );
}

const TAB_BAR_PATHS = new Set([
    '/pages/home/home',
    '/pages/category/category',
    '/pages/age/age',
    '/pages/favorites/favorites',
    '/pages/profile/profile',
]);

Page({
    data: {
        searchPlaceholder: CATEGORY_DATA.searchPlaceholder,
        searchKeyword: '',
        sidebarTabs: SIDEBAR_TABS,
        activeCategoryId: 'all',
        displayItems: buildAllItems() as CategoryItem[],
        scrollIntoViewId: '',
    },

    onTapCategory(e: WechatMiniprogram.TouchEvent) {
        const id = e.currentTarget.dataset.id as string;
        if (!id || id === this.data.activeCategoryId) return;

        const items = getItemsByCategory(id);
        const filtered = filterByKeyword(items, this.data.searchKeyword);

        this.setData({
            activeCategoryId: id,
            displayItems: filtered,
            scrollIntoViewId: '',
        });
    },

    onSearchInput(e: WechatMiniprogram.Input) {
        const keyword = (e.detail.value ?? '').trim();
        const items = getItemsByCategory(this.data.activeCategoryId);
        const filtered = filterByKeyword(items, keyword);

        this.setData({
            searchKeyword: keyword,
            displayItems: filtered,
        });
    },

    onClearSearch() {
        const items = getItemsByCategory(this.data.activeCategoryId);
        this.setData({
            searchKeyword: '',
            displayItems: items,
        });
    },

    onTapItem(e: WechatMiniprogram.TouchEvent) {
        const path = e.currentTarget.dataset.path as string;
        const title = e.currentTarget.dataset.title as string;
        const available = e.currentTarget.dataset.available;

        if (!available || !path) {
            wx.showToast({
                title: title ? `${title} 即将上线` : '即将上线',
                icon: 'none',
            });
            return;
        }

        if (TAB_BAR_PATHS.has(path)) {
            wx.switchTab({ url: path });
            return;
        }

        wx.navigateTo({ url: path });
    },

    onShareAppMessage() {
        return {
            title: '涂鸦丫 - 全部练习分类',
            path: '/pages/category/category',
        };
    },

    onShareTimeline() {
        return {
            title: '涂鸦丫 - 全部练习分类',
            query: '',
        };
    },
});