refactor(ui): 优化导航组件和页面布局

- 移除多个页面的面包屑导航组件
- 添加统一的返回按钮组件替代各页面独立实现
- 优化导航栏滚动检测逻辑和动画效果
- 更新常量类型定义和统计数据
- 调整动态导入的SSR配置为false
- 添加FlipClock组件展示公司运营时长
- 优化新闻列表页的类型安全和响应式设计
This commit is contained in:
张翔
2026-02-28 13:09:07 +08:00
parent 9451814ca4
commit 0cfefaa937
18 changed files with 389 additions and 195 deletions
+5 -7
View File
@@ -1,14 +1,13 @@
'use client';
import { useState, useMemo, useRef } from 'react';
import { useState, useMemo, useRef, ChangeEvent } from 'react';
import { useInView } from 'framer-motion';
import { NEWS } from '@/lib/constants';
import { NEWS, NewsItem } from '@/lib/constants';
import { Card, CardContent } from '@/components/ui/card';
import { Badge } from '@/components/ui/badge';
import { Input } from '@/components/ui/input';
import { Button } from '@/components/ui/button';
import { PageHeader } from '@/components/ui/page-header';
import { Breadcrumb } from '@/components/layout/breadcrumb';
import { Search, Calendar, ArrowRight, ArrowLeft, Filter } from 'lucide-react';
import Link from 'next/link';
import { motion } from 'framer-motion';
@@ -33,7 +32,6 @@ export default function NewsListPage() {
return (
<div className="min-h-screen bg-white">
<Breadcrumb items={[{ label: '新闻动态', href: '/news' }]} />
<PageHeader
title="新闻动态"
description="了解睿新致远最新动态,把握行业发展脉搏"
@@ -79,7 +77,7 @@ export default function NewsListPage() {
type="text"
placeholder="搜索新闻..."
value={searchQuery}
onChange={(e) => setSearchQuery(e.target.value)}
onChange={(e: ChangeEvent<HTMLInputElement>) => setSearchQuery(e.target.value)}
className="pl-10"
/>
</div>
@@ -91,7 +89,7 @@ export default function NewsListPage() {
</div>
) : (
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
{filteredNews.map((news, index) => (
{filteredNews.map((news: NewsItem, index: number) => (
<motion.div
key={news.id}
initial={{ opacity: 0, y: 20 }}
@@ -101,7 +99,7 @@ export default function NewsListPage() {
<Link href={`/news/${news.id}`}>
<Card className="h-full hover:shadow-lg transition-shadow cursor-pointer border-[#E5E5E5] hover:border-[#C41E3A]">
<CardContent className="p-0">
<div className="aspect-video bg-gradient-to-br from-[#C41E3A]/10 to-[#1C1C1C]/10 flex items-center justify-center mb-4">
<div className="aspect-video bg-linear-to-br from-[#C41E3A]/10 to-[#1C1C1C]/10 flex items-center justify-center mb-4">
<span className="text-4xl">📰</span>
</div>
<div className="p-6">