优化评查详情中用户操作的更新刷新为热更新

app/components/layout/Breadcrumb.tsx

@@ -18,6 +18,7 @@ interface PreviousRouteData {
 interface Handle {
   breadcrumb: string | ((data: unknown) => string);
   previousRoute?: PreviousRouteData | ((data: unknown) => PreviousRouteData | undefined);
+  breadcrumbClassName?: string;
 }
 
 interface Match {
@@ -64,12 +65,22 @@ export function Breadcrumb({ items = [], className = '' }: BreadcrumbProps) {
     })
     .flat(); // 扁平化数组
 
+  // 获取自定义类名
+  const getCustomClassName = () => {
+    const lastMatch = matches[matches.length - 1];
+    return lastMatch?.handle?.breadcrumbClassName || '';
+  };
+
   if (breadcrumbs.length === 0) {
     return null;
   }
 
+  // 应用自定义类名
+  const customClassName = getCustomClassName();
+  const finalClassName = `mb-4 ${className} ${customClassName}`.trim();
+
   return (
-    <nav className={`mb-4 ${className}`} aria-label="面包屑导航">
+    <nav className={finalClassName} aria-label="面包屑导航">
       <ol className="flex items-center space-x-2 text-sm text-gray-500">
         <li>
           <Link to="/" className="hover:text-primary-600 flex items-center">

app/components/layout/Layout.tsx

@@ -1,14 +1,33 @@
 import React, { useState, useEffect } from 'react';
 import { Sidebar } from './Sidebar';
-import { Header } from './Header';
+// import { Header } from './Header';
 import { Breadcrumb } from './Breadcrumb';
+import { useMatches } from '@remix-run/react';
 
 interface LayoutProps {
   children: React.ReactNode;
 }
 
+// 添加一个接口表示路由handle可能包含的属性
+interface RouteHandle {
+  hideBreadcrumb?: boolean;
+  [key: string]: any;
+}
+
+interface Match {
+  handle?: RouteHandle;
+  pathname: string;
+  data: unknown;
+}
+
 export function Layout({ children }: LayoutProps) {
   const [sidebarCollapsed, setSidebarCollapsed] = useState(false);
+  const matches = useMatches() as Match[];
+  
+  // 检查当前路由是否应该隐藏默认面包屑
+  const shouldHideBreadcrumb = matches.some(match => 
+    match.handle && match.handle.hideBreadcrumb === true
+  );
   
   // 从本地存储中获取侧边栏状态
   useEffect(() => {
@@ -34,7 +53,7 @@ export function Layout({ children }: LayoutProps) {
       <div className={`main-content ${sidebarCollapsed ? 'sidebar-collapsed' : ''}`}>
         {/* <Header username="系统管理员" /> */}
         <div className="content-container">
-          <Breadcrumb />
+          {!shouldHideBreadcrumb && <Breadcrumb />}
           {children}
         </div>
       </div>