Commit 293f788c authored by dechen lin's avatar dechen lin

feat: vite config

parent 7e468d52
...@@ -68,7 +68,6 @@ export const customUploadToOss = async ( ...@@ -68,7 +68,6 @@ export const customUploadToOss = async (
otherUploadOptions: IUploadOptions otherUploadOptions: IUploadOptions
) => { ) => {
const { openRead, fileType, uploadType = "local" } = otherUploadOptions; const { openRead, fileType, uploadType = "local" } = otherUploadOptions;
console.log("test-options", options.file);
const uploadFile = async () => { const uploadFile = async () => {
switch (uploadType) { switch (uploadType) {
case "oss": case "oss":
......
...@@ -11,6 +11,7 @@ interface SaveStatusProps { ...@@ -11,6 +11,7 @@ interface SaveStatusProps {
export interface SaveStatusRef { export interface SaveStatusRef {
triggerSave: () => void; triggerSave: () => void;
reset: () => void; // 新增的重置方法
} }
const SaveStatus = forwardRef<SaveStatusRef, SaveStatusProps>( const SaveStatus = forwardRef<SaveStatusRef, SaveStatusProps>(
...@@ -24,6 +25,12 @@ const SaveStatus = forwardRef<SaveStatusRef, SaveStatusProps>( ...@@ -24,6 +25,12 @@ const SaveStatus = forwardRef<SaveStatusRef, SaveStatusProps>(
setLastSaveTime(new Date()); setLastSaveTime(new Date());
setShowSaved(true); setShowSaved(true);
}, },
reset: () => {
// 新增的重置方法
setLastSaveTime(null);
setShowSaved(false);
setTimeSinceLastSave("");
},
})); }));
useEffect(() => { useEffect(() => {
......
...@@ -54,12 +54,8 @@ const CodeMirror: React.FC<PropsWithChildren<IProps>> = ({ ...@@ -54,12 +54,8 @@ const CodeMirror: React.FC<PropsWithChildren<IProps>> = ({
editable={editable} editable={editable}
extensions={extensions} extensions={extensions}
onChange={(v) => { onChange={(v) => {
console.log("test-rest-change", v);
onChange?.(v); onChange?.(v);
}} }}
onBeforeInput={(v) => {
console.log("test-onBeforeInput", v);
}}
/> />
); );
}; };
......
...@@ -29,7 +29,7 @@ export const ExtractorSide = ({ className = "" }: IExtractorSideProps) => { ...@@ -29,7 +29,7 @@ export const ExtractorSide = ({ className = "" }: IExtractorSideProps) => {
const params = useParams(); const params = useParams();
const location = useLocation(); const location = useLocation();
const { messages } = useIntl(); const { messages } = useIntl();
console.log("test-params-jobID", params.jobID);
const menuClass = const menuClass =
"px-2 py-2.5 mb-1 text-[0.875rem] text-[#121316]/[0.8] font-semibold rounded h-10 flex items-center cursor-pointer hover:bg-[#0d53de]/[0.05]"; "px-2 py-2.5 mb-1 text-[0.875rem] text-[#121316]/[0.8] font-semibold rounded h-10 flex items-center cursor-pointer hover:bg-[#0d53de]/[0.05]";
......
...@@ -20,7 +20,7 @@ const ExtractorGuide = () => { ...@@ -20,7 +20,7 @@ const ExtractorGuide = () => {
const EXTRACTOR_GUIDE_ITEM_LIST = (messages?.["extractor.side.guide_list"] || const EXTRACTOR_GUIDE_ITEM_LIST = (messages?.["extractor.side.guide_list"] ||
[]) as unknown as GuideItem[]; []) as unknown as GuideItem[];
console.log("test-EXTRACTOR_GUIDE_ITEM_LIST", EXTRACTOR_GUIDE_ITEM_LIST);
const content = ( const content = (
<div> <div>
<div className="text-[1.25rem] font-semibold mt-3 mb-2 ml-4"> <div className="text-[1.25rem] font-semibold mt-3 mb-2 ml-4">
......
...@@ -24,7 +24,7 @@ const ExtractorQueue: React.FC<ExtractorQueueProps> = ({ className }) => { ...@@ -24,7 +24,7 @@ const ExtractorQueue: React.FC<ExtractorQueueProps> = ({ className }) => {
const navigate = useNavigate(); const navigate = useNavigate();
const params = useParams(); const params = useParams();
console.log("test-params", params);
const { data: taskList, mutate } = useRequest(() => { const { data: taskList, mutate } = useRequest(() => {
return getExtractorHistory({ return getExtractorHistory({
pageNo: 1, pageNo: 1,
...@@ -62,9 +62,7 @@ const ExtractorQueue: React.FC<ExtractorQueueProps> = ({ className }) => { ...@@ -62,9 +62,7 @@ const ExtractorQueue: React.FC<ExtractorQueueProps> = ({ className }) => {
? taskList?.[deleteIndex + 1] ? taskList?.[deleteIndex + 1]
: taskList?.[deleteIndex - 1]; : taskList?.[deleteIndex - 1];
mutate(taskList?.filter((i) => i.id !== id)); mutate(taskList?.filter((i) => i.id !== id));
console.log("test-next-job", nextJob);
deleteExtractJob(id).then(() => { deleteExtractJob(id).then(() => {
console.log("test-delete-job", id);
message.success(formatMessage({ id: "extractor.queue.delete.success" })); message.success(formatMessage({ id: "extractor.queue.delete.success" }));
}); });
if (timeout) { if (timeout) {
...@@ -120,7 +118,7 @@ const ExtractorQueue: React.FC<ExtractorQueueProps> = ({ className }) => { ...@@ -120,7 +118,7 @@ const ExtractorQueue: React.FC<ExtractorQueueProps> = ({ className }) => {
useEffect(() => { useEffect(() => {
mutate(taskListRef?.current); mutate(taskListRef?.current);
}, [locale]); }, [locale]);
console.log("test-dd", params);
return ( return (
<div className={cls("w-full flex flex-col mb-3", className)}> <div className={cls("w-full flex flex-col mb-3", className)}>
<header className="flex items-center px-2 py-[0.625rem] text-[#121316]/[0.8] text-[0.875rem] font-semibold"> <header className="flex items-center px-2 py-[0.625rem] text-[#121316]/[0.8] text-[0.875rem] font-semibold">
......
import React, { useEffect, useRef, useState, useMemo, forwardRef, useImperativeHandle, useCallback } from 'react'; import React, {
import cls from 'classnames'; useEffect,
import { isObjEqual } from '@/utils/render'; useRef,
import { useSize } from 'ahooks'; useState,
useMemo,
forwardRef,
useImperativeHandle,
useCallback,
} from "react";
import cls from "classnames";
import { isObjEqual } from "@/utils/render";
import { useSize } from "ahooks";
interface IImageLayersViewerProps { interface IImageLayersViewerProps {
imageUrl: string; imageUrl: string;
...@@ -27,8 +35,23 @@ export interface ImageLayerViewerRef { ...@@ -27,8 +35,23 @@ export interface ImageLayerViewerRef {
updateScaleAndPosition: () => void; updateScaleAndPosition: () => void;
} }
const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps>( const ImageLayerViewer = forwardRef<
({ imageUrl, imageHeight, imageWidth, onChange, layout, disableZoom, className = '', layerVisible = true }, ref) => { ImageLayerViewerRef,
IImageLayersViewerProps
>(
(
{
imageUrl,
imageHeight,
imageWidth,
onChange,
layout,
disableZoom,
className = "",
layerVisible = true,
},
ref
) => {
const containerRef = useRef<HTMLDivElement>(null); const containerRef = useRef<HTMLDivElement>(null);
const imageCanvasRef = useRef<HTMLCanvasElement>(null); const imageCanvasRef = useRef<HTMLCanvasElement>(null);
const overlayCanvasRef = useRef<HTMLCanvasElement>(null); const overlayCanvasRef = useRef<HTMLCanvasElement>(null);
...@@ -53,7 +76,8 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps ...@@ -53,7 +76,8 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps
}, [imageUrl]); }, [imageUrl]);
const calculateInitialScaleAndPosition = useCallback(() => { const calculateInitialScaleAndPosition = useCallback(() => {
if (!containerRef.current) return { initialScale: 1, initialPosition: { x: 0, y: 0 } }; if (!containerRef.current)
return { initialScale: 1, initialPosition: { x: 0, y: 0 } };
const containerWidth = containerRef.current.clientWidth; const containerWidth = containerRef.current.clientWidth;
const containerHeight = containerRef.current.clientHeight; const containerHeight = containerRef.current.clientHeight;
...@@ -66,14 +90,15 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps ...@@ -66,14 +90,15 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps
const initialPosition = { const initialPosition = {
x: (containerWidth - scaledWidth) / 2, x: (containerWidth - scaledWidth) / 2,
y: (containerHeight - scaledHeight) / 2 y: (containerHeight - scaledHeight) / 2,
}; };
return { initialScale, initialPosition }; return { initialScale, initialPosition };
}, [imageWidth, imageHeight]); }, [imageWidth, imageHeight]);
const updateScaleAndPosition = useCallback(() => { const updateScaleAndPosition = useCallback(() => {
const { initialScale, initialPosition } = calculateInitialScaleAndPosition(); const { initialScale, initialPosition } =
calculateInitialScaleAndPosition();
setScale(initialScale); setScale(initialScale);
setPosition(initialPosition); setPosition(initialPosition);
setPadding({ left: 0, top: 0 }); setPadding({ left: 0, top: 0 });
...@@ -84,7 +109,7 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps ...@@ -84,7 +109,7 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps
}, [imageWidth, imageHeight]); }, [imageWidth, imageHeight]);
const drawImage = useCallback(() => { const drawImage = useCallback(() => {
const ctx = imageCanvasRef.current?.getContext('2d'); const ctx = imageCanvasRef.current?.getContext("2d");
if (!ctx || !image.complete) return; if (!ctx || !image.complete) return;
const scaledWidth = imageWidth * scale; const scaledWidth = imageWidth * scale;
...@@ -102,7 +127,7 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps ...@@ -102,7 +127,7 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps
}, [image, imageWidth, imageHeight, scale, dpr]); }, [image, imageWidth, imageHeight, scale, dpr]);
const drawLayout = useCallback(() => { const drawLayout = useCallback(() => {
const ctx = overlayCanvasRef.current?.getContext('2d'); const ctx = overlayCanvasRef.current?.getContext("2d");
if (!ctx) return; if (!ctx) return;
const scaledWidth = imageWidth * scale; const scaledWidth = imageWidth * scale;
...@@ -118,28 +143,30 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps ...@@ -118,28 +143,30 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps
ctx.clearRect(0, 0, scaledWidth, scaledHeight); ctx.clearRect(0, 0, scaledWidth, scaledHeight);
layout?.forEach((item) => { layout?.forEach((item) => {
const [x1, y1, x2, y2, x3, y3, x4, y4] = item.poly.map((coord) => coord * scale); const [x1, y1, x2, y2, x3, y3, x4, y4] = item.poly.map(
(coord) => coord * scale
);
switch (item.category_id) { switch (item.category_id) {
case 9: case 9:
ctx.fillStyle = 'rgba(230, 113, 230, 0.4)'; ctx.fillStyle = "rgba(230, 113, 230, 0.4)";
ctx.strokeStyle = 'rgba(230, 113, 230, 1)'; ctx.strokeStyle = "rgba(230, 113, 230, 1)";
break; break;
case 8: case 8:
ctx.fillStyle = 'rgba(240, 240, 124, 0.4)'; ctx.fillStyle = "rgba(240, 240, 124, 0.4)";
ctx.strokeStyle = 'rgba(240, 240, 124, 1)'; ctx.strokeStyle = "rgba(240, 240, 124, 1)";
break; break;
case 13: case 13:
ctx.fillStyle = 'rgba(150, 232, 172, 0.4)'; ctx.fillStyle = "rgba(150, 232, 172, 0.4)";
ctx.strokeStyle = 'rgba(150, 232, 172, 1)'; ctx.strokeStyle = "rgba(150, 232, 172, 1)";
break; break;
case 14: case 14:
ctx.fillStyle = 'rgba(230, 122, 171, 0.4)'; ctx.fillStyle = "rgba(230, 122, 171, 0.4)";
ctx.strokeStyle = 'rgba(230, 122, 171, 1)'; ctx.strokeStyle = "rgba(230, 122, 171, 1)";
break; break;
default: default:
ctx.fillStyle = 'transparent'; ctx.fillStyle = "transparent";
ctx.strokeStyle = 'transparent'; ctx.strokeStyle = "transparent";
} }
ctx.beginPath(); ctx.beginPath();
...@@ -168,8 +195,14 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps ...@@ -168,8 +195,14 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps
const newScaledHeight = imageHeight * newScale; const newScaledHeight = imageHeight * newScale;
let newPosition = { let newPosition = {
x: position.x - ((x - position.x) * (newScaledWidth - prevScaledWidth)) / prevScaledWidth, x:
y: position.y - ((y - position.y) * (newScaledHeight - prevScaledHeight)) / prevScaledHeight position.x -
((x - position.x) * (newScaledWidth - prevScaledWidth)) /
prevScaledWidth,
y:
position.y -
((y - position.y) * (newScaledHeight - prevScaledHeight)) /
prevScaledHeight,
}; };
// Center the image if it's smaller than the container // Center the image if it's smaller than the container
...@@ -186,7 +219,7 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps ...@@ -186,7 +219,7 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps
// Calculate new padding // Calculate new padding
const newPadding = { const newPadding = {
left: Math.max(0, -newPosition.x), left: Math.max(0, -newPosition.x),
top: Math.max(0, -newPosition.y) top: Math.max(0, -newPosition.y),
}; };
setPadding(newPadding); setPadding(newPadding);
} }
...@@ -212,7 +245,9 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps ...@@ -212,7 +245,9 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps
const handleCenterZoom = useCallback( const handleCenterZoom = useCallback(
(zoomIn: boolean) => { (zoomIn: boolean) => {
const newScale = zoomIn ? scale * (1 + zoomStep) : scale / (1 + zoomStep); const newScale = zoomIn
? scale * (1 + zoomStep)
: scale / (1 + zoomStep);
const boundedNewScale = Math.max(minZoom, Math.min(newScale, maxZoom)); const boundedNewScale = Math.max(minZoom, Math.min(newScale, maxZoom));
if (containerRef.current) { if (containerRef.current) {
...@@ -241,7 +276,7 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps ...@@ -241,7 +276,7 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps
zoomIn, zoomIn,
zoomOut, zoomOut,
scale, scale,
updateScaleAndPosition updateScaleAndPosition,
}), }),
[zoomIn, zoomOut, scale] [zoomIn, zoomOut, scale]
); );
...@@ -257,10 +292,10 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps ...@@ -257,10 +292,10 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps
} }
}; };
container.addEventListener('wheel', handleWheel, { passive: false }); container.addEventListener("wheel", handleWheel, { passive: false });
return () => { return () => {
container.removeEventListener('wheel', handleWheel); container.removeEventListener("wheel", handleWheel);
}; };
}, [handleZoom]); }, [handleZoom]);
...@@ -268,7 +303,7 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps ...@@ -268,7 +303,7 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps
if (containerRef?.current) { if (containerRef?.current) {
containerRef.current?.scrollTo({ containerRef.current?.scrollTo({
left: padding.left, left: padding.left,
top: padding.top top: padding.top,
}); });
} }
}, [padding]); }, [padding]);
...@@ -288,7 +323,7 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps ...@@ -288,7 +323,7 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps
useEffect(() => { useEffect(() => {
if (overlayCanvasRef.current) { if (overlayCanvasRef.current) {
overlayCanvasRef.current.style.opacity = layerVisible ? '1' : '0'; overlayCanvasRef.current.style.opacity = layerVisible ? "1" : "0";
} }
}, [layerVisible]); }, [layerVisible]);
...@@ -296,13 +331,18 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps ...@@ -296,13 +331,18 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps
onChange?.({ scale }); onChange?.({ scale });
}, [scale]); }, [scale]);
console.log('test-render');
return ( return (
<div className={cls(className, 'w-full h-full overflow-auto scrollbar-thin relative')} ref={containerRef}> <div
className={cls(
className,
"w-full h-full overflow-auto scrollbar-thin relative"
)}
ref={containerRef}
>
<div <div
style={{ style={{
paddingLeft: `${padding.left}px`, paddingLeft: `${padding.left}px`,
paddingTop: `${padding.top}px` paddingTop: `${padding.top}px`,
}} }}
> >
<div <div
...@@ -310,14 +350,14 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps ...@@ -310,14 +350,14 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps
style={{ style={{
width: `${imageWidth * scale}px`, width: `${imageWidth * scale}px`,
height: `${imageHeight * scale}px`, height: `${imageHeight * scale}px`,
transform: `translate(${position.x}px, ${position.y}px)` transform: `translate(${position.x}px, ${position.y}px)`,
}} }}
> >
<canvas <canvas
ref={imageCanvasRef} ref={imageCanvasRef}
style={{ style={{
width: `${imageWidth * scale}px`, width: `${imageWidth * scale}px`,
height: `${imageHeight * scale}px` height: `${imageHeight * scale}px`,
}} }}
/> />
<canvas <canvas
...@@ -325,7 +365,7 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps ...@@ -325,7 +365,7 @@ const ImageLayerViewer = forwardRef<ImageLayerViewerRef, IImageLayersViewerProps
className="absolute top-0 left-0" className="absolute top-0 left-0"
style={{ style={{
width: `${imageWidth * scale}px`, width: `${imageWidth * scale}px`,
height: `${imageHeight * scale}px` height: `${imageHeight * scale}px`,
}} }}
/> />
</div> </div>
......
...@@ -138,6 +138,7 @@ const MdViewer: React.FC<IMdViewerProps> = ({ ...@@ -138,6 +138,7 @@ const MdViewer: React.FC<IMdViewerProps> = ({
if (taskInfo?.markdownUrl) { if (taskInfo?.markdownUrl) {
setMdUrlArr(taskInfo?.markdownUrl); setMdUrlArr(taskInfo?.markdownUrl);
} }
statusRef?.current?.reset();
}, [taskInfo?.markdownUrl, params?.jobID]); }, [taskInfo?.markdownUrl, params?.jobID]);
const handleContentChange = (val: string, index: number) => { const handleContentChange = (val: string, index: number) => {
......
...@@ -71,7 +71,6 @@ export const ExtractorUploadButton = ({ ...@@ -71,7 +71,6 @@ export const ExtractorUploadButton = ({
}; };
const onChange = async (pdfFile: any) => { const onChange = async (pdfFile: any) => {
if (pdfFile?.file?.status === "done") { if (pdfFile?.file?.status === "done") {
console.log("test-pdf", pdfFile);
const res = const res =
submitType === "reUpload" submitType === "reUpload"
? await postReUploadExtractTask(String(urlParams?.jobID)) ? await postReUploadExtractTask(String(urlParams?.jobID))
......
...@@ -8,8 +8,7 @@ export default defineConfig({ ...@@ -8,8 +8,7 @@ export default defineConfig({
server: { server: {
proxy: { proxy: {
"/api": { "/api": {
// target: "https://staging.openxlab.org.cn/datasets", target: "http://localhost:5559",
target: "http://10.6.16.169:5559",
changeOrigin: true, changeOrigin: true,
}, },
}, },
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment