品牌方功能: - 项目看板: 添加截止日期编辑功能 - 项目详情: 添加代理商管理、截止日期编辑、最近任务显示代理商 - 项目创建: 代理商选择支持搜索(名称/ID/公司名) - 代理商管理: 通过ID邀请、添加备注/分配项目/移除操作 - Brief配置: 新增项目级Brief和规则配置页面 - 系统设置: 完善账户安全(密码/2FA/邮箱/手机/设备管理)、数据导出、退出登录 代理商功能: - 个人中心: 新增代理商ID展示、公司信息(企业验证)、个人信息编辑 - 账户设置: 密码修改、手机/邮箱绑定、两步验证 - 通知设置: 分类型和渠道的通知开关 - 审核历史: 搜索筛选和统计展示 - 帮助反馈: FAQ分类搜索和客服联系 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
120 lines
3.6 KiB
TypeScript
120 lines
3.6 KiB
TypeScript
'use client'
|
|
|
|
import Link from 'next/link'
|
|
import { usePathname } from 'next/navigation'
|
|
import {
|
|
ShieldCheck,
|
|
ListTodo,
|
|
User,
|
|
LayoutDashboard,
|
|
Scan,
|
|
BarChart3,
|
|
Settings,
|
|
FileText,
|
|
Users,
|
|
Bell,
|
|
FolderKanban,
|
|
PlusCircle,
|
|
ClipboardCheck,
|
|
Bot,
|
|
MessageSquare
|
|
} from 'lucide-react'
|
|
import { cn } from '@/lib/utils'
|
|
|
|
interface NavItem {
|
|
icon: React.ElementType
|
|
label: string
|
|
href: string
|
|
}
|
|
|
|
// 达人端导航项
|
|
const creatorNavItems: NavItem[] = [
|
|
{ icon: ListTodo, label: '我的任务', href: '/creator' },
|
|
{ icon: Bell, label: '消息中心', href: '/creator/messages' },
|
|
{ icon: User, label: '个人中心', href: '/creator/profile' },
|
|
]
|
|
|
|
// 代理商端导航项
|
|
const agencyNavItems: NavItem[] = [
|
|
{ icon: LayoutDashboard, label: '工作台', href: '/agency' },
|
|
{ icon: Scan, label: '审核台', href: '/agency/review' },
|
|
{ icon: MessageSquare, label: '申诉处理', href: '/agency/appeals' },
|
|
{ icon: FileText, label: 'Brief 配置', href: '/agency/briefs' },
|
|
{ icon: Users, label: '达人管理', href: '/agency/creators' },
|
|
{ icon: BarChart3, label: '数据报表', href: '/agency/reports' },
|
|
{ icon: Bell, label: '消息中心', href: '/agency/messages' },
|
|
{ icon: User, label: '个人中心', href: '/agency/profile' },
|
|
]
|
|
|
|
// 品牌方端导航项
|
|
const brandNavItems: NavItem[] = [
|
|
{ icon: FolderKanban, label: '项目看板', href: '/brand' },
|
|
{ icon: PlusCircle, label: '创建项目', href: '/brand/projects/create' },
|
|
{ icon: ClipboardCheck, label: '终审台', href: '/brand/review' },
|
|
{ icon: Users, label: '代理商管理', href: '/brand/agencies' },
|
|
{ icon: FileText, label: '规则配置', href: '/brand/rules' },
|
|
{ icon: Bot, label: 'AI 配置', href: '/brand/ai-config' },
|
|
{ icon: Settings, label: '系统设置', href: '/brand/settings' },
|
|
]
|
|
|
|
interface SidebarProps {
|
|
role?: 'creator' | 'agency' | 'brand'
|
|
}
|
|
|
|
export function Sidebar({ role = 'creator' }: SidebarProps) {
|
|
const pathname = usePathname() || ''
|
|
|
|
const navItems = role === 'creator'
|
|
? creatorNavItems
|
|
: role === 'agency'
|
|
? agencyNavItems
|
|
: brandNavItems
|
|
|
|
const isActive = (href: string) => {
|
|
if (href === `/${role}`) {
|
|
return pathname === href || pathname === `/${role}/`
|
|
}
|
|
return pathname.startsWith(href)
|
|
}
|
|
|
|
return (
|
|
<aside className="fixed left-0 top-0 bottom-0 z-sidebar w-[260px] bg-bg-card flex flex-col">
|
|
{/* Logo 区域 */}
|
|
<div className="flex items-center gap-3 px-6 py-6">
|
|
<div className="w-9 h-9 rounded-[10px] bg-gradient-to-br from-accent-indigo to-[#4F46E5] flex items-center justify-center">
|
|
<ShieldCheck className="w-5 h-5 text-white" />
|
|
</div>
|
|
<span className="text-xl font-bold text-text-primary">秒思</span>
|
|
</div>
|
|
|
|
{/* 导航列表 */}
|
|
<nav className="flex-1 px-4 py-2">
|
|
<div className="flex flex-col gap-1">
|
|
{navItems.map((item) => {
|
|
const Icon = item.icon
|
|
const active = isActive(item.href)
|
|
|
|
return (
|
|
<Link
|
|
key={item.href}
|
|
href={item.href}
|
|
className={cn(
|
|
'flex items-center gap-3 px-4 py-3 rounded-[10px] transition-colors',
|
|
active
|
|
? 'bg-bg-elevated text-text-primary font-semibold'
|
|
: 'text-text-secondary hover:bg-bg-elevated/50'
|
|
)}
|
|
>
|
|
<Icon className="w-5 h-5" />
|
|
<span className="text-[15px]">{item.label}</span>
|
|
</Link>
|
|
)
|
|
})}
|
|
</div>
|
|
</nav>
|
|
</aside>
|
|
)
|
|
}
|
|
|
|
export default Sidebar
|