import { useEffect, useMemo, useState } from 'react';
import Taro from '@tarojs/taro';
import { Button, Text, View } from '@tarojs/components';
import { getTenantContext } from '@/services/api';
import { loadStudentDashboard, type DashboardSnapshot } from '@/services/catalog';
import { loadCurrentUser } from '@/services/auth';
import './index.css';

export default function StudentHomePage() {
  const tenant = getTenantContext();
  const [snapshot, setSnapshot] = useState<DashboardSnapshot | null>(null);
  const [userName, setUserName] = useState('');

  useEffect(() => {
    loadStudentDashboard().then(setSnapshot).catch(() => setSnapshot({ entries: [], banners: [], announcements: [], profile: null }));
    loadCurrentUser().then(payload => setUserName(payload.user?.name || payload.item?.name || '')).catch(() => setUserName(''));
  }, []);

  const entryNames = useMemo(() => (snapshot?.entries || []).slice(0, 6), [snapshot]);
  const brandName = tenant?.branding.brandName || tenant?.branding.shortName || '工学题库';
  const quickActions = [
    { name: '选地区', path: '/pages/student/region/index', meta: '目标地区 / 权益' },
    { name: '刷题', path: '/pages/student/catalog/index', meta: '顺序 / 随机 / 模考' },
    { name: '错题收藏', path: '/pages/student/review/index', meta: '错题 / 收藏复习' },
    { name: '练习报告', path: '/pages/student/reports/index', meta: '模考 / 历史' },
    { name: '背单词', path: '/pages/student/vocabulary/index', meta: '复习计划' },
    { name: '知识手册', path: '/pages/student/handbook/index', meta: '章节阅读' },
    { name: '分数线', path: '/pages/student/scoreline/index', meta: '院校趋势' },
    { name: 'AI择校', path: '/pages/student/ai-school/index', meta: 'SVIP报告' },
    { name: '资料', path: '/pages/student/assets/index', meta: 'PDF 预览' },
    { name: '消息', path: '/pages/student/notifications/index', meta: '通知 / 待办' },
    { name: '个人中心', path: '/pages/student/profile/index', meta: '会员 / 订单' },
  ];

  return (
    <View className='student-page'>
      <View className='topbar'>
        <View>
          <Text className='brand'>{brandName}</Text>
          <Text className='subline'>{userName ? `${userName}，继续学习` : '题库、手册、资料和会员统一入口'}</Text>
        </View>
        <Button className='ghost-button' onClick={() => Taro.navigateTo({ url: '/pages/student/profile/index' })}>我的</Button>
      </View>

      <View className='hero-band'>
        <Text className='hero-title'>今日学习</Text>
        <Text className='hero-copy'>题库、背单词、知识手册、分数线、资料和会员都已接入新 SaaS 后端。</Text>
      </View>

      <View className='section'>
        <Text className='section-title'>学习入口</Text>
        <View className='entry-grid'>
          {entryNames.length ? entryNames.map(item => (
            <View className='entry-tile' key={item.id} onClick={() => Taro.navigateTo({ url: `/pages/student/catalog/index?entryId=${item.id}` })}>
              <Text className='entry-name'>{item.name}</Text>
              <Text className='entry-type'>{item.entryType || 'content'}</Text>
            </View>
          )) : quickActions.map(item => (
            <View className='entry-tile' key={item.name} onClick={() => Taro.navigateTo({ url: item.path })}>
              <Text className='entry-name'>{item.name}</Text>
              <Text className='entry-type'>{item.meta}</Text>
            </View>
          ))}
        </View>
      </View>

      <View className='section'>
        <Text className='section-title'>功能导航</Text>
        <View className='entry-grid'>
          {quickActions.map(item => (
            <View className='entry-tile compact' key={item.path} onClick={() => Taro.navigateTo({ url: item.path })}>
              <Text className='entry-name'>{item.name}</Text>
              <Text className='entry-type'>{item.meta}</Text>
            </View>
          ))}
        </View>
      </View>
    </View>
  );
}
