Add complete CKE Project implementation with news management system
This commit is contained in:
190
app/admin/page.tsx
Normal file
190
app/admin/page.tsx
Normal file
@ -0,0 +1,190 @@
|
||||
'use client';
|
||||
|
||||
import React from 'react';
|
||||
import Link from 'next/link';
|
||||
import { FileText, Eye, Calendar, TrendingUp, Plus } from 'lucide-react';
|
||||
import { NEWS_DATA } from '@/lib/news-data';
|
||||
|
||||
export default function AdminDashboard() {
|
||||
// Подсчет статистики
|
||||
const totalNews = NEWS_DATA.length;
|
||||
const publishedNews = NEWS_DATA.filter(news => news.published !== false).length;
|
||||
const featuredNews = NEWS_DATA.filter(news => news.featured).length;
|
||||
const recentNews = NEWS_DATA.filter(news => {
|
||||
const publishDate = new Date(news.publishedAt);
|
||||
const weekAgo = new Date();
|
||||
weekAgo.setDate(weekAgo.getDate() - 7);
|
||||
return publishDate >= weekAgo;
|
||||
}).length;
|
||||
|
||||
const stats = [
|
||||
{
|
||||
name: 'Всего новостей',
|
||||
value: totalNews,
|
||||
icon: FileText,
|
||||
color: 'bg-blue-500',
|
||||
textColor: 'text-blue-600'
|
||||
},
|
||||
{
|
||||
name: 'Опубликовано',
|
||||
value: publishedNews,
|
||||
icon: Eye,
|
||||
color: 'bg-green-500',
|
||||
textColor: 'text-green-600'
|
||||
},
|
||||
{
|
||||
name: 'Рекомендуемые',
|
||||
value: featuredNews,
|
||||
icon: TrendingUp,
|
||||
color: 'bg-yellow-500',
|
||||
textColor: 'text-yellow-600'
|
||||
},
|
||||
{
|
||||
name: 'За неделю',
|
||||
value: recentNews,
|
||||
icon: Calendar,
|
||||
color: 'bg-purple-500',
|
||||
textColor: 'text-purple-600'
|
||||
}
|
||||
];
|
||||
|
||||
const latestNews = NEWS_DATA
|
||||
.sort((a, b) => new Date(b.publishedAt).getTime() - new Date(a.publishedAt).getTime())
|
||||
.slice(0, 5);
|
||||
|
||||
return (
|
||||
<div className="space-y-8">
|
||||
{/* Header */}
|
||||
<div className="flex flex-col sm:flex-row sm:items-center sm:justify-between">
|
||||
<div>
|
||||
<h1 className="text-3xl font-bold text-gray-900">Панель управления</h1>
|
||||
<p className="text-gray-600 mt-2">Обзор системы управления новостями</p>
|
||||
</div>
|
||||
<Link
|
||||
href="/admin/news/create"
|
||||
className="mt-4 sm:mt-0 inline-flex items-center px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 transition-colors"
|
||||
>
|
||||
<Plus className="h-4 w-4 mr-2" />
|
||||
Создать новость
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
{/* Stats Grid */}
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
|
||||
{stats.map((stat) => (
|
||||
<div key={stat.name} className="bg-white rounded-lg shadow-sm p-6">
|
||||
<div className="flex items-center">
|
||||
<div className={`p-3 rounded-lg ${stat.color} bg-opacity-10`}>
|
||||
<stat.icon className={`h-6 w-6 ${stat.textColor}`} />
|
||||
</div>
|
||||
<div className="ml-4">
|
||||
<p className="text-sm text-gray-600">{stat.name}</p>
|
||||
<p className="text-2xl font-bold text-gray-900">{stat.value}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{/* Recent News */}
|
||||
<div className="bg-white rounded-lg shadow-sm">
|
||||
<div className="px-6 py-4 border-b border-gray-200">
|
||||
<div className="flex items-center justify-between">
|
||||
<h2 className="text-lg font-semibold text-gray-900">Последние новости</h2>
|
||||
<Link
|
||||
href="/admin/news"
|
||||
className="text-blue-600 hover:text-blue-800 text-sm font-medium"
|
||||
>
|
||||
Показать все
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="divide-y divide-gray-200">
|
||||
{latestNews.map((news) => (
|
||||
<div key={news.id} className="px-6 py-4 hover:bg-gray-50">
|
||||
<div className="flex items-center justify-between">
|
||||
<div className="flex-1">
|
||||
<div className="flex items-center space-x-2">
|
||||
<h3 className="text-sm font-medium text-gray-900 truncate">
|
||||
{news.title}
|
||||
</h3>
|
||||
{news.featured && (
|
||||
<span className="inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-yellow-100 text-yellow-800">
|
||||
Рекомендуемое
|
||||
</span>
|
||||
)}
|
||||
<span className={`inline-flex items-center px-2 py-1 rounded-full text-xs font-medium ${
|
||||
news.published !== false
|
||||
? 'bg-green-100 text-green-800'
|
||||
: 'bg-gray-100 text-gray-800'
|
||||
}`}>
|
||||
{news.published !== false ? 'Опубликовано' : 'Черновик'}
|
||||
</span>
|
||||
</div>
|
||||
<p className="text-sm text-gray-500 mt-1">
|
||||
{new Date(news.publishedAt).toLocaleDateString('ru-RU')}
|
||||
</p>
|
||||
</div>
|
||||
<div className="flex items-center space-x-2">
|
||||
<Link
|
||||
href={`/admin/news/${news.id}/edit`}
|
||||
className="text-blue-600 hover:text-blue-800 text-sm"
|
||||
>
|
||||
Редактировать
|
||||
</Link>
|
||||
<Link
|
||||
href={`/news/${news.slug}`}
|
||||
target="_blank"
|
||||
className="text-gray-600 hover:text-gray-800 text-sm"
|
||||
>
|
||||
Просмотр
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Quick Actions */}
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div className="bg-white rounded-lg shadow-sm p-6">
|
||||
<h3 className="text-lg font-semibold text-gray-900 mb-4">Быстрые действия</h3>
|
||||
<div className="space-y-3">
|
||||
<Link
|
||||
href="/admin/news/create"
|
||||
className="flex items-center p-3 rounded-md hover:bg-gray-50 transition-colors"
|
||||
>
|
||||
<Plus className="h-5 w-5 text-blue-600 mr-3" />
|
||||
<span className="text-sm font-medium text-gray-900">Создать новость</span>
|
||||
</Link>
|
||||
<Link
|
||||
href="/admin/news"
|
||||
className="flex items-center p-3 rounded-md hover:bg-gray-50 transition-colors"
|
||||
>
|
||||
<FileText className="h-5 w-5 text-green-600 mr-3" />
|
||||
<span className="text-sm font-medium text-gray-900">Управление новостями</span>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-white rounded-lg shadow-sm p-6">
|
||||
<h3 className="text-lg font-semibold text-gray-900 mb-4">Статистика по категориям</h3>
|
||||
<div className="space-y-3">
|
||||
{['company', 'promotions', 'other'].map((category) => {
|
||||
const count = NEWS_DATA.filter(news => news.category === category).length;
|
||||
const categoryName = category === 'company' ? 'Новости компании' :
|
||||
category === 'promotions' ? 'Акции' : 'Другое';
|
||||
return (
|
||||
<div key={category} className="flex items-center justify-between">
|
||||
<span className="text-sm text-gray-600">{categoryName}</span>
|
||||
<span className="text-sm font-medium text-gray-900">{count}</span>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
Reference in New Issue
Block a user