Refactor/optimize ui #24
+10
-10
@@ -48,13 +48,13 @@ interface DashboardStats {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const modelCards = [
|
const modelCards = [
|
||||||
{ code: 'news', name: '新闻资讯', icon: Newspaper, color: 'bg-blue-50 text-blue-600' },
|
{ code: 'news', name: '新闻资讯', icon: Newspaper, color: 'bg-accent-blue-soft text-accent-blue' },
|
||||||
{ code: 'case-study', name: '案例研究', icon: Briefcase, color: 'bg-amber-50 text-amber-600' },
|
{ code: 'case-study', name: '案例研究', icon: Briefcase, color: 'bg-accent-amber-soft text-accent-amber' },
|
||||||
{ code: 'service', name: '服务管理', icon: Settings, color: 'bg-success-bg text-success-text' },
|
{ code: 'service', name: '服务管理', icon: Settings, color: 'bg-success-bg text-success-text' },
|
||||||
{ code: 'product', name: '产品管理', icon: Box, color: 'bg-purple-50 text-purple-600' },
|
{ code: 'product', name: '产品管理', icon: Box, color: 'bg-accent-purple-soft text-accent-purple' },
|
||||||
{ code: 'solution', name: '解决方案', icon: Layers, color: 'bg-teal-50 text-teal-600' },
|
{ code: 'solution', name: '解决方案', icon: Layers, color: 'bg-accent-teal-soft text-accent-teal' },
|
||||||
{ code: 'hero-banner', name: 'Hero Banner', icon: Image, color: 'bg-rose-50 text-rose-600' },
|
{ code: 'hero-banner', name: 'Hero Banner', icon: Image, color: 'bg-accent-rose-soft text-accent-rose' },
|
||||||
{ code: 'stat-item', name: '数据指标', icon: BarChart3, color: 'bg-indigo-50 text-indigo-600' },
|
{ code: 'stat-item', name: '数据指标', icon: BarChart3, color: 'bg-accent-indigo-soft text-accent-indigo' },
|
||||||
];
|
];
|
||||||
|
|
||||||
const MODEL_LABELS: Record<string, string> = {
|
const MODEL_LABELS: Record<string, string> = {
|
||||||
@@ -130,9 +130,9 @@ export default function AdminDashboardPage() {
|
|||||||
{/* Stats cards */}
|
{/* Stats cards */}
|
||||||
<div className="grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-6 gap-4">
|
<div className="grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-6 gap-4">
|
||||||
{[
|
{[
|
||||||
{ label: '内容模型', value: stats?.models ?? '-', icon: FileText, color: 'bg-blue-50' },
|
{ label: '内容模型', value: stats?.models ?? '-', icon: FileText, color: 'bg-accent-blue-soft' },
|
||||||
{ label: '内容条目', value: stats?.items ?? '-', icon: Layers, color: 'bg-purple-50' },
|
{ label: '内容条目', value: stats?.items ?? '-', icon: Layers, color: 'bg-accent-purple-soft' },
|
||||||
{ label: '页面区域', value: stats?.zones ?? '-', icon: Briefcase, color: 'bg-amber-50' },
|
{ label: '页面区域', value: stats?.zones ?? '-', icon: Briefcase, color: 'bg-accent-amber-soft' },
|
||||||
{ label: '活跃用户', value: stats?.activeUsers ?? '-', icon: Users, color: 'bg-success-bg' },
|
{ label: '活跃用户', value: stats?.activeUsers ?? '-', icon: Users, color: 'bg-success-bg' },
|
||||||
{
|
{
|
||||||
label: '待审核',
|
label: '待审核',
|
||||||
@@ -145,7 +145,7 @@ export default function AdminDashboardPage() {
|
|||||||
label: '未读通知',
|
label: '未读通知',
|
||||||
value: stats?.unreadNotifications ?? '-',
|
value: stats?.unreadNotifications ?? '-',
|
||||||
icon: Bell,
|
icon: Bell,
|
||||||
color: 'bg-indigo-50',
|
color: 'bg-accent-indigo-soft',
|
||||||
highlight: (stats?.unreadNotifications ?? 0) > 0,
|
highlight: (stats?.unreadNotifications ?? 0) > 0,
|
||||||
},
|
},
|
||||||
].map((stat) => (
|
].map((stat) => (
|
||||||
|
|||||||
@@ -51,6 +51,14 @@ body {
|
|||||||
--color-accent-cyan-soft: rgba(6, 182, 212, 0.12);
|
--color-accent-cyan-soft: rgba(6, 182, 212, 0.12);
|
||||||
--color-accent-cyan-rgb: 6 182 212;
|
--color-accent-cyan-rgb: 6 182 212;
|
||||||
|
|
||||||
|
--color-accent-rose: #E11D48;
|
||||||
|
--color-accent-rose-soft: rgba(225, 29, 72, 0.12);
|
||||||
|
--color-accent-rose-rgb: 225 29 72;
|
||||||
|
|
||||||
|
--color-accent-indigo: #4F46E5;
|
||||||
|
--color-accent-indigo-soft: rgba(79, 70, 229, 0.12);
|
||||||
|
--color-accent-indigo-rgb: 79 70 229;
|
||||||
|
|
||||||
/* 背景色层级 */
|
/* 背景色层级 */
|
||||||
--color-bg-primary: #FFFFFF;
|
--color-bg-primary: #FFFFFF;
|
||||||
--color-bg-secondary: #F8FAFC;
|
--color-bg-secondary: #F8FAFC;
|
||||||
|
|||||||
@@ -41,6 +41,10 @@ module.exports = {
|
|||||||
'purple-soft': 'var(--color-accent-purple-soft)',
|
'purple-soft': 'var(--color-accent-purple-soft)',
|
||||||
cyan: 'rgb(var(--color-accent-cyan-rgb) / <alpha-value>)',
|
cyan: 'rgb(var(--color-accent-cyan-rgb) / <alpha-value>)',
|
||||||
'cyan-soft': 'var(--color-accent-cyan-soft)',
|
'cyan-soft': 'var(--color-accent-cyan-soft)',
|
||||||
|
rose: 'rgb(var(--color-accent-rose-rgb) / <alpha-value>)',
|
||||||
|
'rose-soft': 'var(--color-accent-rose-soft)',
|
||||||
|
indigo: 'rgb(var(--color-accent-indigo-rgb) / <alpha-value>)',
|
||||||
|
'indigo-soft': 'var(--color-accent-indigo-soft)',
|
||||||
},
|
},
|
||||||
bg: {
|
bg: {
|
||||||
primary: 'rgb(var(--color-bg-primary-rgb) / <alpha-value>)',
|
primary: 'rgb(var(--color-bg-primary-rgb) / <alpha-value>)',
|
||||||
|
|||||||
Reference in New Issue
Block a user