From 5b13594a6882b60ed52fe1088fb76f95aabf3862 Mon Sep 17 00:00:00 2001 From: shay7sev Date: Sat, 28 Feb 2026 17:59:19 +0800 Subject: [PATCH] fix(store): rect --- components/label/store.ts | 54 +++++++++++++++++++++-- components/label/usePaperStore.ts | 73 ++++++++++++++++++++++--------- 2 files changed, 104 insertions(+), 23 deletions(-) diff --git a/components/label/store.ts b/components/label/store.ts index a7283bd..9bc1118 100644 --- a/components/label/store.ts +++ b/components/label/store.ts @@ -6,6 +6,50 @@ import { Comment } from "./api/label/typing" import { safeClone } from "./utils/clone" type LabelData = Map> +type LabelPathTuple = [number, any[], any, any[]] + +const isPaperPointLike = (value: any) => { + return ( + value && + typeof value === "object" && + !Array.isArray(value) && + typeof value.x === "number" && + typeof value.y === "number" + ) +} + +const isPaperSegmentLike = (value: any) => { + return ( + value && + typeof value === "object" && + !Array.isArray(value) && + value.point && + isPaperPointLike(value.point) + ) +} + +const normalizePointCollection = (value: any): any => { + if (Array.isArray(value)) { + return value.map((item) => normalizePointCollection(item)) + } + if (isPaperSegmentLike(value)) { + return [value.point.x, value.point.y] + } + if (isPaperPointLike(value)) { + return [value.x, value.y] + } + return value +} + +const normalizeLabelPathTuple = (path: LabelPathTuple): LabelPathTuple => { + return [ + path[0], + normalizePointCollection(path[1]), + path[2], + normalizePointCollection(path[3]), + ] +} + interface LabelState { // pathId pathPoints detail hollowPathPoints label: LabelData @@ -219,7 +263,7 @@ export const useLabelStore = create( if (arr.length === 10) { arr.shift() } - arr.push(newData) + arr.push(safeClone(newData)) console.log(arr) return storeSet((state) => { return { @@ -285,12 +329,16 @@ export const useLabelStore = create( }), setOperation: (imageId, operationId, path) => storeSet((state) => { + const normalizedPath = normalizeLabelPathTuple(path) const labelData = useLabelStore.getState().label if (!labelData.has(imageId)) { labelData.set(imageId, new Map()) } if (labelData.get(imageId)?.get(operationId)?.length) { - let result = [...labelData.get(imageId)?.get(operationId)!, path] + let result = [ + ...labelData.get(imageId)?.get(operationId)!, + normalizedPath, + ] .reduce((acc, curr) => { const key = curr[0] acc.set(key, curr) @@ -299,7 +347,7 @@ export const useLabelStore = create( .values() labelData.get(imageId)?.set(operationId, Array.from(result)) } else { - labelData.get(imageId)?.set(operationId, [path]) + labelData.get(imageId)?.set(operationId, [normalizedPath]) } console.log("绘制时", labelData) useLabelStore.getState().pushStateStack(safeClone(labelData)) diff --git a/components/label/usePaperStore.ts b/components/label/usePaperStore.ts index b0d86d3..0e0e3a7 100644 --- a/components/label/usePaperStore.ts +++ b/components/label/usePaperStore.ts @@ -2354,15 +2354,32 @@ export const usePaperStore = create((set) => ({ } } } else if (brushPath instanceof paper.Path) { - if (brushPath.segments && brushPath.segments.length) - useLabelStore - .getState() - .setOperation( - brushPath.data.imageId, - brushPath.data.operationId, - [brushPath.data.id, [brushPath.segments], newDetail, []] - ) - else { + if (brushPath.segments && brushPath.segments.length) { + const pathData = JSON.parse( + brushPath.exportJSON({ precision: 20 }) + ) + const brushSegments = pathData?.[1]?.segments + if (brushSegments?.length) { + useLabelStore + .getState() + .setOperation( + brushPath.data.imageId, + brushPath.data.operationId, + [brushPath.data.id, [brushSegments], newDetail, []] + ) + } else { + usePaperSupportStore + .getState() + .removeMaskById(brushPath.data.id) + useLabelStore + .getState() + .deleteOperation( + brushPath.data.imageId, + brushPath.data.operationId, + brushPath.data.id + ) + } + } else { usePaperSupportStore.getState().removeMaskById(brushPath.data.id) useLabelStore .getState() @@ -2407,15 +2424,32 @@ export const usePaperStore = create((set) => ({ category_id: Number(pointPath.data.operationId), } if (pointPath instanceof paper.Path) { - if (pointPath.segments && pointPath.segments.length) - useLabelStore - .getState() - .setOperation( - pointPath.data.imageId, - pointPath.data.operationId, - [pointPath.data.id, [pointPath.segments], newDetail, []] - ) - else { + if (pointPath.segments && pointPath.segments.length) { + const pathData = JSON.parse( + pointPath.exportJSON({ precision: 20 }) + ) + const pointSegments = pathData?.[1]?.segments + if (pointSegments?.length) { + useLabelStore + .getState() + .setOperation( + pointPath.data.imageId, + pointPath.data.operationId, + [pointPath.data.id, [pointSegments], newDetail, []] + ) + } else { + usePaperSupportStore + .getState() + .removeMaskById(pointPath.data.id) + useLabelStore + .getState() + .deleteOperation( + pointPath.data.imageId, + pointPath.data.operationId, + pointPath.data.id + ) + } + } else { usePaperSupportStore.getState().removeMaskById(pointPath.data.id) useLabelStore .getState() @@ -3329,8 +3363,7 @@ export const usePaperStore = create((set) => ({ useTopToolsStore.getState().activeOperation, [ rect.data.id, - // todo check - [rect?.segments.map((e) => e.point)], + [JSON.parse(rect.exportJSON({ precision: 20 }))[1]?.segments], { ...initialDetail, uid: usePermissionStore.getState().user_id,