'use client';
/**
 * /dashboard — 工作台（各角色登录后的中转落地页）
 * 按角色展示对应入口
 */
import Link from 'next/link';
import { useAuthStore } from '@/stores/authStore';

export default function DashboardPage() {
  const { user, role } = useAuthStore();

  return (
    <div className="p-6 max-w-3xl">
      <h2 className="text-xl font-bold text-text-primary mb-2">
        你好，{user?.username ?? '朋友'}
      </h2>
      <p className="text-text-secondary text-sm mb-8">
        {role === 'admin' && '你是管理员，可管理产品配置和审核'}
        {role === 'supervisor' && '你是组长，负责审核待发笔记'}
        {role === 'operator' && '今天要生成什么主题？'}
      </p>

      <div className="grid grid-cols-3 gap-4">
        {role !== 'supervisor' && (
          <DashCard href="/tasks/new" icon="✏️" label="开新任务" desc="选产品，输今天主题，开始生成" />
        )}
        {(role === 'supervisor' || role === 'admin') && (
          <DashCard href="/review" icon="✅" label="审核台" desc="查看待审笔记，通过或打回" />
        )}
        {role === 'admin' && (
          <DashCard href="/config" icon="⚙️" label="配置中心" desc="管理产品、标杆笔记、违禁词和 API Key" />
        )}
        <DashCard href="/history" icon="🗂️" label="历史归档" desc="查看历史任务和成品库" />
      </div>
    </div>
  );
}

function DashCard({ href, icon, label, desc }: {
  href: string; icon: string; label: string; desc: string;
}) {
  return (
    <Link href={href}
      aria-label={label}
      className="border border-border-default rounded-xl p-5 bg-surface-primary hover:border-brand-orange hover:shadow-sm transition-all group">
      <span className="text-3xl block mb-2" aria-hidden="true">{icon}</span>
      <h3 className="font-semibold text-text-primary text-sm group-hover:text-brand-orange">{label}</h3>
      <p className="text-xs text-text-secondary mt-1">{desc}</p>
    </Link>
  );
}
