feat: style

projects/web/src/components/SaveStatus.tsx

@@ -4,6 +4,7 @@ import React, {
   useImperativeHandle,
   forwardRef,
 } from "react";
+import cls from "classnames";
 
 interface SaveStatusProps {
   className?: string;
@@ -18,7 +19,7 @@ const SaveStatus = forwardRef<SaveStatusRef, SaveStatusProps>(
   ({ className }, ref) => {
     const [lastSaveTime, setLastSaveTime] = useState<Date | null>(null);
     const [showSaved, setShowSaved] = useState(false);
-    const [timeSinceLastSave, setTimeSinceLastSave] = useState("");
+    const [timeSinceLastSave, setTimeSinceLastSave] = useState(0);
 
     useImperativeHandle(ref, () => ({
       triggerSave: () => {
@@ -29,7 +30,7 @@ const SaveStatus = forwardRef<SaveStatusRef, SaveStatusProps>(
         // 新增的重置方法
         setLastSaveTime(null);
         setShowSaved(false);
-        setTimeSinceLastSave("");
+        setTimeSinceLastSave(0);
       },
     }));
 
@@ -50,7 +51,7 @@ const SaveStatus = forwardRef<SaveStatusRef, SaveStatusProps>(
             (now.getTime() - lastSaveTime.getTime()) / 60000
           );
           if (diffInMinutes > 0) {
-            setTimeSinceLastSave(`${diffInMinutes} 分钟前`);
+            setTimeSinceLastSave(diffInMinutes);
           }
         }
       };
@@ -61,10 +62,20 @@ const SaveStatus = forwardRef<SaveStatusRef, SaveStatusProps>(
     }, [lastSaveTime]);
 
     return (
-      <div className={className}>
-        {showSaved && <span>已保存</span>}
-        {!showSaved && lastSaveTime && (
-          <span>最近修改：{timeSinceLastSave}</span>
+      <div className={cls("flex items-center", className)}>
+        {showSaved && (
+          <span className="text-[#121316]/[0.6] text-[13px] leading-[24px]">
+            已保存
+          </span>
+        )}
+        {timeSinceLastSave > 0 && !showSaved && lastSaveTime && (
+          <span className="text-[#121316]/[0.6] text-[13px] leading-[24px]">
+            最近修改：{timeSinceLastSave} 分钟前
+          </span>
+        )}
+        {(showSaved ||
+          (timeSinceLastSave > 0 && !showSaved && lastSaveTime)) && (
+          <span className="w-[1px] h-[0.75rem] bg-[#D7D8DD] ml-[1rem] block"></span>
         )}
       </div>
     );

projects/web/src/pages/extract/components/extractor-queue/index.tsx

@@ -69,7 +69,11 @@ const ExtractorQueue: React.FC<ExtractorQueueProps> = ({ className }) => {
       clearTimeout(timeout);
     }
     timeout = setTimeout(() => {
-      handleExtractor(nextJob?.type, nextJob?.id);
+      if (nextJob?.id) {
+        handleExtractor(nextJob?.type as any, nextJob?.id);
+      } else {
+        navigate("/OpenSourceTools/Extractor");
+      }
     }, 10);
   };
   const taskListRef = useLatest(taskList);
@@ -82,7 +86,7 @@ const ExtractorQueue: React.FC<ExtractorQueueProps> = ({ className }) => {
           id: taskData?.id,
           type: taskData?.type,
           state: taskData?.state, // 提取状态
-        },
+        } as any,
       ].concat(taskListRef?.current)
     );
   };

projects/web/src/pages/extract/components/md-viewer/index.tsx

@@ -170,6 +170,7 @@ const MdViewer: React.FC<IMdViewerProps> = ({
           ))}
         </ul>
         <SaveStatus ref={statusRef} />
+
         {displayType === "code" && (
           <>
             <Tooltip