// Apps Center Page

function AppsPage() {
  const { navigate, showToast } = useApp();

  const modules = [
    { name: '商城中心', desc: '实物·虚拟·服务，好物好价', icon: '🛒', color: '#FF6B3D', action: 'mall' },
    { name: '云祭祀', desc: '逝者纪念堂，在线祭扫', icon: '🕯️', color: '#8B7355', action: 'memorial' },
    { name: '网上祠堂', desc: '家族宗祠，供奉先祖', icon: '🏛️', color: '#5D3A1A', action: 'temple' },
    { name: '爱情空间', desc: '甜蜜记忆，永久珍藏', icon: '💕', color: '#EC4899', action: 'love' },
    { name: '记账模块', desc: '收支管理，轻松记账', icon: '💰', color: '#10B981', action: 'accounting' },
    { name: '凭据保险箱', desc: '账号密码，安全保管', icon: '🔒', color: '#6366F1', action: 'credentials' },
    { name: '久聊IM', desc: '即时通讯，畅聊无阻', icon: '💬', color: '#0EA5E9', action: 'im' },
    { name: '视频广场', desc: '精彩视频，发现有趣', icon: '🎬', color: '#1F2937', action: 'video' },
    { name: '会员中心', desc: '尊享特权，专属服务', icon: '👑', color: '#B8860B', action: 'member' },
    { name: '企业黄页', desc: '企业名录，商机无限', icon: '🏢', color: '#D2691E', action: 'yellowpages' },
    { name: '网站地图', desc: '全站导航，快速直达', icon: '🗺️', color: '#86909C', action: 'sitemap' },
    { name: '订单中心', desc: '订单管理，账单明细', icon: '📋', color: '#8B5CF6', action: 'orders' },
    { name: '分销中心', desc: '分享赚钱，佣金丰厚', icon: '💰', color: '#DC2626', action: 'distribution' },
    { name: '管道收益', desc: '分销+代理+第三方 多重收入', icon: '🚀', color: '#FF6B3D', action: 'pipe-income' },
    { name: '在线排版', desc: '文字排版，一键美化', icon: '📝', color: '#F59E0B', action: 'typesetting' },
    { name: '二维码生成器', desc: '快速生成专属二维码', icon: '🔳', color: '#0EA5E9', action: 'qrcode' },
    { name: '问答', desc: '有问题问大家，悬赏获真知', icon: '❓', color: '#8B5CF6', action: 'qa' },
    { name: '百科', desc: '全民编辑，知识共享', icon: '📖', color: '#0891B2', action: 'wiki' },
    { name: '空间广场', desc: '发现有趣的人和他们的空间', icon: '🏠', color: '#8B5CF6', action: 'space-square' },
  ];

  return (
    <PageWrapper>
      <AppHeader title="应用中心" subtitle="全部模块" />
      
      <div style={{ padding: 16 }}>
        <div className="card card-shadow" style={{ marginBottom: 16 }}>
          <div style={{ fontSize: 15, fontWeight: 600, marginBottom: 8 }}>全部应用</div>
          <div style={{ fontSize: 12, color: 'var(--text-tertiary)' }}>
            久存网提供丰富的功能模块，满足您的多种需求
          </div>
        </div>

        <div className="grid-2">
          {modules.map(mod => (
            <div
              key={mod.name}
              className="card card-shadow"
              style={{ cursor: 'pointer' }}
              onClick={() => navigate(mod.action)}
            >
              <div
                style={{
                  width: 44,
                  height: 44,
                  borderRadius: 12,
                  background: `linear-gradient(135deg, ${mod.color}, ${mod.color}AA)`,
                  display: 'flex',
                  alignItems: 'center',
                  justifyContent: 'center',
                  fontSize: 22,
                  marginBottom: 10,
                }}
              >
                {mod.icon}
              </div>
              <div style={{ fontSize: 14, fontWeight: 600, marginBottom: 4 }}>
                {mod.name}
              </div>
              <div style={{ fontSize: 11, color: 'var(--text-tertiary)', lineHeight: 1.4 }}>
                {mod.desc}
              </div>
            </div>
          ))}
        </div>

        {/* More Coming */}
        <div style={{
          textAlign: 'center',
          padding: '24px 16px',
          color: 'var(--text-tertiary)',
          fontSize: 12,
        }}>
          更多精彩功能，持续开发中...
        </div>
      </div>
    </PageWrapper>
  );
}

Object.assign(window, { AppsPage });