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

import { CATEGORIES } from '../../core/data/categories';
import { AGE_BANDS, AgeBandKey } from '../../core/data/difficulty';

const CATEGORY_TABS = [
    { id: 'all', name: '全部' },
    ...CATEGORIES.map((c) => ({ id: c.id, name: c.name })),
];

const AGE_BAND_ICONS = ['🌱', '🚀', '🎓', '🧠', '🏆'] as const;

type HomeTrackCard = {
    id: string;
    title: string;
    subtitle: string;
    icon: string;
    topBg: string;
};

const MOCK_MATH_TRACK: HomeTrackCard[] = [
    {
        id: 'm1',
        title: '认识数字1-10',
        subtitle: '启蒙第一课',
        icon: '🔢',
        topBg: '#fff3c4',
    },
    {
        id: 'm2',
        title: '形状对对碰',
        subtitle: '空间感训练',
        icon: '📐',
        topBg: '#f5e6dc',
    },
    {
        id: 'm3',
        title: '数量比一比',
        subtitle: '数感小游戏',
        icon: '⚖️',
        topBg: '#d8f0d0',
    },
    {
        id: 'm4',
        title: '规律找一找',
        subtitle: '逻辑思维',
        icon: '🔍',
        topBg: '#e8f4ff',
    },
    {
        id: 'm5',
        title: '简单加减',
        subtitle: '动手练一练',
        icon: '➕',
        topBg: '#fce4ec',
    },
];

const MOCK_CHINESE_TRACK: HomeTrackCard[] = [
    {
        id: 'c1',
        title: '基础笔画连连看',
        subtitle: '书法初体验',
        icon: '🖌',
        topBg: '#f5e6dc',
    },
    {
        id: 'c2',
        title: '看图识汉字',
        subtitle: '字形联想',
        icon: '📖',
        topBg: '#d8f0d0',
    },
    {
        id: 'c3',
        title: '拼音小闯关',
        subtitle: '声母韵母',
        icon: '🔤',
        topBg: '#fff3c4',
    },
    {
        id: 'c4',
        title: '词语搭配',
        subtitle: '词汇积累',
        icon: '✏️',
        topBg: '#e8f4ff',
    },
    {
        id: 'c5',
        title: '古诗诵读',
        subtitle: '语感培养',
        icon: '🎵',
        topBg: '#fce4ec',
    },
];

const MOCK_HOT_RECOMMENDS = [
    {
        id: 'hot-1',
        title: '100以内的加减法',
        desc: '让算术变得像游戏一样简单',
        tag: '数学',
        score: '4.8',
        emoji: '🍊',
    },
    {
        id: 'hot-2',
        title: '创意涂鸦大作战',
        desc: '释放孩子的艺术想象力',
        tag: '艺术',
        score: '4.9',
        emoji: '🎨',
    },
] as const;

const { statusBarHeight } = wx.getWindowInfo();

Page({
    data: {
        statusBarHeight,
        tabs: CATEGORY_TABS,
        activeTab: 'all',
        ageBands: AGE_BANDS.map((item, idx) => ({
            ...item,
            icon: AGE_BAND_ICONS[idx] || '🌟',
        })),
        activeAgeBand: AGE_BANDS[0].key as AgeBandKey,
        hotRecommends: [...MOCK_HOT_RECOMMENDS],
        mathTrackCards: MOCK_MATH_TRACK,
        chineseTrackCards: MOCK_CHINESE_TRACK,
    },

    onTabChange(e: WechatMiniprogram.CustomEvent) {
        this.setData({ activeTab: e.detail.id });
    },

    onTapAgeBand(e: WechatMiniprogram.TouchEvent) {
        const key = e.currentTarget.dataset.key as AgeBandKey | undefined;
        if (!key) return;
        this.setData({ activeAgeBand: key });
    },

    onTapHotRecommend(e: WechatMiniprogram.TouchEvent) {
        const title = e.currentTarget.dataset.title as string | undefined;
        if (!title) return;
        wx.showToast({ title: `已选择：${title}`, icon: 'none' });
    },

    onTapAgeMore() {
        wx.showToast({ title: '分龄全部 即将上线', icon: 'none' });
    },

    onTapHotMore() {
        wx.showToast({ title: '热门推荐 即将上线', icon: 'none' });
    },

    onTapTrackMore(e: WechatMiniprogram.TouchEvent) {
        const category = e.currentTarget.dataset.category as string | undefined;
        if (!category) return;
        wx.navigateTo({
            url: `/pages/category/category?category=${category}`,
        });
    },

    onTapTrackCard(e: WechatMiniprogram.TouchEvent) {
        const title = e.currentTarget.dataset.title as string | undefined;
        if (!title) return;
        wx.showToast({ title, icon: 'none' });
    },

    onShareAppMessage() {
        return {
            title: '涂鸦丫 - 快来生成宝宝的专属学习卡',
            path: '/pages/home/home',
            imageUrl:
                'https://cdn.joeyone.cn/doodle/share-img/index-share-v2.png',
        };
    },

    onShareTimeline() {
        return {
            title: '涂鸦丫 - 快来生成宝宝的专属学习卡',
            query: '',
        };
    },
});