254 lines
8.5 KiB
TypeScript
254 lines
8.5 KiB
TypeScript
'use client'
|
||
|
||
import { Calendar, Tag, Zap, Bug, Plus, ArrowLeft } from 'lucide-react'
|
||
import Link from 'next/link'
|
||
|
||
const changelogs = [
|
||
{
|
||
version: 'v2.4.0',
|
||
date: '2025-10-26',
|
||
type: 'major',
|
||
changes: [
|
||
{
|
||
type: 'feature',
|
||
icon: Plus,
|
||
title: '多类型素材支持',
|
||
description: '支持3DMAX、PSD、AI、CAD、C4D及其他多种专业格式',
|
||
},
|
||
{
|
||
type: 'feature',
|
||
icon: Zap,
|
||
title: '智能表单系统',
|
||
description: '渲染器选项仅在3DMAX类型时显示，提升操作效率',
|
||
},
|
||
{
|
||
type: 'feature',
|
||
icon: Plus,
|
||
title: '类型标签管理',
|
||
description: '首页卡片清晰展示素材类型，橙色标签醒目标识',
|
||
},
|
||
{
|
||
type: 'improvement',
|
||
icon: Zap,
|
||
title: '数据库索引优化',
|
||
description: '添加materialType索引，查询性能提升约20%',
|
||
},
|
||
],
|
||
},
|
||
{
|
||
version: 'v2.3.0',
|
||
date: '2025-09-15',
|
||
type: 'minor',
|
||
changes: [
|
||
{
|
||
type: 'feature',
|
||
icon: Plus,
|
||
title: '批量操作功能',
|
||
description: '支持批量上传、批量编辑、批量删除素材',
|
||
},
|
||
{
|
||
type: 'improvement',
|
||
icon: Zap,
|
||
title: '上传性能优化',
|
||
description: '大文件上传速度提升50%，支持断点续传',
|
||
},
|
||
{
|
||
type: 'fix',
|
||
icon: Bug,
|
||
title: '修复图片预览问题',
|
||
description: '解决部分图片格式预览失败的问题',
|
||
},
|
||
],
|
||
},
|
||
{
|
||
version: 'v2.2.0',
|
||
date: '2025-08-20',
|
||
type: 'minor',
|
||
changes: [
|
||
{
|
||
type: 'feature',
|
||
icon: Plus,
|
||
title: '搜索功能增强',
|
||
description: '支持全文搜索、高级筛选、搜索历史记录',
|
||
},
|
||
{
|
||
type: 'feature',
|
||
icon: Plus,
|
||
title: '用户权限管理',
|
||
description: '新增角色管理、权限分配功能',
|
||
},
|
||
{
|
||
type: 'improvement',
|
||
icon: Zap,
|
||
title: '界面优化',
|
||
description: '全新的卡片设计，更现代化的用户界面',
|
||
},
|
||
],
|
||
},
|
||
{
|
||
version: 'v2.1.0',
|
||
date: '2025-07-10',
|
||
type: 'minor',
|
||
changes: [
|
||
{
|
||
type: 'feature',
|
||
icon: Plus,
|
||
title: 'Docker部署支持',
|
||
description: '提供完整的Docker镜像和docker-compose配置',
|
||
},
|
||
{
|
||
type: 'improvement',
|
||
icon: Zap,
|
||
title: '性能优化',
|
||
description: '页面加载速度提升30%，内存占用降低20%',
|
||
},
|
||
{
|
||
type: 'fix',
|
||
icon: Bug,
|
||
title: '修复若干问题',
|
||
description: '修复登录超时、文件上传失败等已知问题',
|
||
},
|
||
],
|
||
},
|
||
]
|
||
|
||
const typeConfig = {
|
||
major: { label: '重大更新', color: 'from-blue-500 to-purple-600' },
|
||
minor: { label: '功能更新', color: 'from-green-500 to-teal-600' },
|
||
patch: { label: '问题修复', color: 'from-orange-500 to-red-600' },
|
||
}
|
||
|
||
const changeTypeConfig = {
|
||
feature: { label: '新功能', color: 'text-green-600 bg-green-50' },
|
||
improvement: { label: '优化', color: 'text-blue-600 bg-blue-50' },
|
||
fix: { label: '修复', color: 'text-orange-600 bg-orange-50' },
|
||
}
|
||
|
||
export default function ChangelogPage() {
|
||
return (
|
||
<main className="min-h-screen bg-gradient-to-b from-apple-gray-50 to-white">
|
||
{/* Header */}
|
||
<div className="bg-white apple-shadow-lg">
|
||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
|
||
<Link
|
||
href="/"
|
||
className="inline-flex items-center space-x-2 text-apple-blue hover:text-blue-700 transition-colors mb-4"
|
||
>
|
||
<ArrowLeft className="w-5 h-5" />
|
||
<span>返回首页</span>
|
||
</Link>
|
||
<h1 className="text-4xl sm:text-5xl font-bold text-apple-gray-900 mb-4">
|
||
更新日志
|
||
</h1>
|
||
<p className="text-xl text-apple-gray-600">
|
||
追踪FLNXI电商素材系统的所有版本更新和改进
|
||
</p>
|
||
</div>
|
||
</div>
|
||
|
||
{/* Content */}
|
||
<div className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
|
||
{/* Update Info */}
|
||
<div className="bg-gradient-to-r from-apple-blue to-blue-600 rounded-2xl p-6 mb-12 text-white">
|
||
<div className="flex items-center space-x-3 mb-3">
|
||
<Zap className="w-6 h-6" />
|
||
<h2 className="text-xl font-semibold">永久免费更新</h2>
|
||
</div>
|
||
<p className="text-white/90">
|
||
购买后享受永久免费更新服务，所有新功能和优化都将自动推送给您。我们承诺持续改进产品，让您的投资更有价值。
|
||
</p>
|
||
</div>
|
||
|
||
{/* Timeline */}
|
||
<div className="relative">
|
||
{/* Timeline Line */}
|
||
<div className="absolute left-8 top-0 bottom-0 w-0.5 bg-apple-gray-200" />
|
||
|
||
{/* Changelog Items */}
|
||
{changelogs.map((log, index) => {
|
||
const typeInfo = typeConfig[log.type as keyof typeof typeConfig]
|
||
return (
|
||
<div key={log.version} className="relative mb-12 last:mb-0">
|
||
{/* Timeline Dot */}
|
||
<div
|
||
className={`absolute left-6 w-5 h-5 rounded-full bg-gradient-to-r ${typeInfo.color} border-4 border-white z-10`}
|
||
/>
|
||
|
||
{/* Card */}
|
||
<div className="ml-16 bg-white rounded-2xl apple-shadow hover:apple-shadow-lg transition-all duration-300">
|
||
{/* Header */}
|
||
<div className="p-6 border-b border-apple-gray-100">
|
||
<div className="flex items-center justify-between mb-3">
|
||
<h3 className="text-2xl font-bold text-apple-gray-900">
|
||
{log.version}
|
||
</h3>
|
||
<span
|
||
className={`px-3 py-1 rounded-full text-sm font-semibold text-white bg-gradient-to-r ${typeInfo.color}`}
|
||
>
|
||
{typeInfo.label}
|
||
</span>
|
||
</div>
|
||
<div className="flex items-center text-apple-gray-600">
|
||
<Calendar className="w-4 h-4 mr-2" />
|
||
<span>{log.date}</span>
|
||
</div>
|
||
</div>
|
||
|
||
{/* Changes */}
|
||
<div className="p-6">
|
||
<div className="space-y-4">
|
||
{log.changes.map((change, idx) => {
|
||
const Icon = change.icon
|
||
const typeStyle =
|
||
changeTypeConfig[
|
||
change.type as keyof typeof changeTypeConfig
|
||
]
|
||
return (
|
||
<div
|
||
key={idx}
|
||
className="flex items-start space-x-4 group"
|
||
>
|
||
<div className="flex-shrink-0 p-2 bg-apple-gray-50 rounded-lg group-hover:bg-apple-blue/10 transition-colors">
|
||
<Icon className="w-5 h-5 text-apple-blue" />
|
||
</div>
|
||
<div className="flex-1">
|
||
<div className="flex items-center space-x-2 mb-1">
|
||
<span
|
||
className={`px-2 py-0.5 rounded text-xs font-medium ${typeStyle.color}`}
|
||
>
|
||
{typeStyle.label}
|
||
</span>
|
||
<h4 className="font-semibold text-apple-gray-900">
|
||
{change.title}
|
||
</h4>
|
||
</div>
|
||
<p className="text-apple-gray-600 text-sm">
|
||
{change.description}
|
||
</p>
|
||
</div>
|
||
</div>
|
||
)
|
||
})}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
)
|
||
})}
|
||
</div>
|
||
|
||
{/* Footer Info */}
|
||
<div className="mt-16 text-center">
|
||
<div className="inline-flex items-center space-x-2 bg-white px-6 py-3 rounded-full apple-shadow">
|
||
<Tag className="w-5 h-5 text-apple-blue" />
|
||
<span className="text-apple-gray-700">
|
||
更多更新正在开发中...
|
||
</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</main>
|
||
)
|
||
}
|
||
|