feat(web): Index/model/space/tool ui upgrade

web/src/components/RbCard/index.tsx

@@ -2,7 +2,7 @@
  * @Author: ZhaoYing 
  * @Date: 2026-02-02 15:21:14 
  * @Last Modified by: ZhaoYing
- * @Last Modified time: 2026-02-24 14:59:53
+ * @Last Modified time: 2026-03-20 20:24:43
  */
 /**
  * RbCard Component
@@ -23,6 +23,7 @@ import clsx from 'clsx';
 
 /** Props interface for RbCard component */
 interface RbCardProps extends CardProps {
+  isNeedTooltip?: boolean;
   children?: ReactNode;
   /** Custom avatar component */
   avatarText?: string;
@@ -32,16 +33,22 @@ interface RbCardProps extends CardProps {
   /** Click handler */
   onClick?: () => void;
   footer?: ReactNode;
+  headerClassName?: string;
+  titleClassName?: string;
 }
 
 /** Custom card component with flexible styling and header options */
 const RbCard: FC<RbCardProps> = ({
+  isNeedTooltip = true,
   title,
   children,
   avatarText,
   avatarClassName,
   avatarUrl,
   footer,
+  headerClassName,
+  titleClassName,
+  className,
   ...props
 }) => {
   return (
@@ -54,17 +61,23 @@ const RbCard: FC<RbCardProps> = ({
           : avatarText
             ? <Flex align="center" justify="center" className={clsx(avatarClassName, "rb:size-11 rb:rounded-lg rb:text-[24px] rb:text-[#ffffff] rb:bg-[#155EEF]")}>{avatarText}</Flex> : null
         }
-        <Tooltip title={title}>
-          <div className="rb:flex-1 rb:leading-5.5 rb:min-w-0 rb:whitespace-break-spaces rb:wrap-break-word rb:line-clamp-2">
+        {isNeedTooltip
+          ? <Tooltip title={title}>
+            <div className={`rb:flex-1 rb:leading-5.5 rb:min-w-0 rb:whitespace-break-spaces rb:wrap-break-word rb:line-clamp-2 ${titleClassName}`}>
+              {title}
+            </div>
+          </Tooltip>
+          : <div className="rb:flex-1 rb:leading-5.5 rb:min-w-0 rb:whitespace-break-spaces rb:wrap-break-word rb:line-clamp-2">
             {title}
           </div>
-        </Tooltip>
+        }
+        
       </Flex>}
       classNames={{
-        header: 'rb:text-[16px] rb:p-[16px_16px_8px_16px]! rb:border-0!',
-        body: 'rb:p-4! rb:bg-white!',
+        header: `rb:text-[16px] rb:p-[16px_16px_8px_16px]! rb:border-0! ${headerClassName}`,
+        body: 'rb:p-4! rb:pt-2! rb:bg-white!',
       }}
-      className="rb:hover:shadow-[0px_2px_8px_0px_rgba(23,23,25,0.16)]! rb:group"
+      className={`rb:hover:shadow-[0px_2px_8px_0px_rgba(23,23,25,0.16)]! rb:group ${className}`}
     >
       {children}