Merge pull request #542 from lihqi/lhq-0819alpha

feat(lb-components): SetLoading when the pointCloudData is loaded

packages/lb-components/src/App.tsx

@@ -108,9 +108,9 @@ export interface AppProps {
   preDataProcess?: (params: IPreDataProcessParams) => IPointCloudBox[];
   auditContext?: any;
   getImgIndexByExternal: GetImgIndexByExternal;
-  annotationBefore?: (setAnnotationData:Function)=>void;
-
-  toolStyle?: ToolStyle
+  annotationBefore?: (setAnnotationData: Function) => void;
+  setResourceLoading?: (loading: boolean) => void;
+  toolStyle?: ToolStyle;
 }
 
 const App: React.FC<AppProps> = (props) => {

packages/lb-components/src/components/pointCloudView/PointCloudListener.tsx

@@ -36,6 +36,7 @@ const { EPolygonPattern } = cTool;
 interface IProps extends IA2MapStateProps {
   checkMode?: boolean;
   toolInstanceRef: React.MutableRefObject<ICustomToolInstance>;
+  setResourceLoading?: (loading: boolean) => void;
 }
 
 const PointCloudListener: React.FC<IProps> = ({
@@ -45,6 +46,7 @@ const PointCloudListener: React.FC<IProps> = ({
   configString,
   imgIndex,
   toolInstanceRef,
+  setResourceLoading,
 }) => {
   const ptCtx = useContext(PointCloudContext);
   const {
@@ -63,7 +65,9 @@ const PointCloudListener: React.FC<IProps> = ({
 
   const { updateRotate } = useRotate({ currentData });
   const { updateRotateEdge } = useRotateEdge({ currentData });
-  const { updatePointCloudData, topViewSelectedChanged } = usePointCloudViews();
+  const { updatePointCloudData, topViewSelectedChanged } = usePointCloudViews({
+    setResourceLoading,
+  });
   const {
     redo,
     undo,

packages/lb-components/src/components/pointCloudView/PointCloudSegmentListener.tsx

@@ -7,7 +7,7 @@ import { PointCloudContext } from './PointCloudContext';
 import { CommonToolUtils } from '@labelbee/lb-annotation';
 import { EPointCloudSegmentMode, PointCloudUtils } from '@labelbee/lb-utils';
 import { useAttribute } from './hooks/useAttribute';
-import { SetPointCloudLoading } from '@/store/annotation/actionCreators';
+import { SetAnnotationLoading } from '@/store/annotation/actionCreators';
 import { jsonParser } from '@/utils';
 
 interface IProps extends IA2MapStateProps {
@@ -42,13 +42,13 @@ const PointCloudSegmentListener: React.FC<IProps> = ({
        * 2. clear all segment data.
        *
        */
-      SetPointCloudLoading(dispatch, true);
+      SetAnnotationLoading(dispatch, true);
       ptSegmentInstance.emit('clearStash');
       ptSegmentInstance.emit('clearAllSegmentData');
       ptSegmentInstance.loadPCDFile(currentData?.url ?? '').then(() => {
         const segmentData = PointCloudUtils.getSegmentFromResultList(currentData?.result ?? '');
         ptSegmentInstance?.store?.updateCurrentSegment(segmentData);
-        SetPointCloudLoading(dispatch, false);
+        SetAnnotationLoading(dispatch, false);
       });
 
       // Update segmentData.

packages/lb-components/src/components/pointCloudView/hooks/usePointCloudViews.ts

@@ -40,7 +40,7 @@ import { jsonParser, getRectPointCloudBox, generatePointCloudBoxRects } from '@/
 import type { GeneratePointCloudBoxRectsOptions } from '@/utils';
 import {
   PreDataProcess,
-  SetPointCloudLoading,
+  SetAnnotationLoading,
   SetLoadPCDFileLoading,
 } from '@/store/annotation/actionCreators';
 import { useHistory } from './useHistory';
@@ -605,7 +605,11 @@ export const synchronizeTopView = (
   pointCloud2dOperation.setResultAndSelectedID(newPolygonList, newPolygon.id);
 };
 
-export const usePointCloudViews = () => {
+interface IUsePointCloudViewsParams {
+  setResourceLoading?: (loading: boolean) => void;
+}
+
+export const usePointCloudViews = (params?: IUsePointCloudViewsParams) => {
   const ptCtx = useContext(PointCloudContext);
   const {
     topViewInstance,
@@ -1306,8 +1310,9 @@ export const usePointCloudViews = () => {
      */
     setHighlight2DDataList([]);
 
-    SetPointCloudLoading(dispatch, true);
+    SetAnnotationLoading(dispatch, true);
     SetLoadPCDFileLoading(dispatch, true);
+    params?.setResourceLoading?.(true);
     await mainViewInstance.loadPCDFile(newData.url, config?.radius ?? DEFAULT_RADIUS);
 
     mainViewInstance?.clearAllBox();
@@ -1383,8 +1388,9 @@ export const usePointCloudViews = () => {
       pointCloudSphereList: sphereParamsList,
     });
 
-    SetPointCloudLoading(dispatch, false);
+    SetAnnotationLoading(dispatch, false);
     SetLoadPCDFileLoading(dispatch, false);
+    params?.setResourceLoading?.(false);
   };
 
   return {

packages/lb-components/src/components/pointCloudView/index.tsx

@@ -45,6 +45,7 @@ interface IProps extends IA2MapStateProps {
   checkMode?: boolean;
   intelligentFit?: boolean;
   measureVisible?: boolean;
+  setResourceLoading?: (loading: boolean) => void;
 }
 
 const PointCloudView: React.FC<IProps> = (props) => {
@@ -57,6 +58,7 @@ const PointCloudView: React.FC<IProps> = (props) => {
     imgIndex,
     config,
     measureVisible,
+    setResourceLoading,
   } = props;
   const ptCtx = useContext(PointCloudContext);
   const { globalPattern, setGlobalPattern, selectedIDs } = ptCtx;
@@ -160,7 +162,11 @@ const PointCloudView: React.FC<IProps> = (props) => {
 
   return (
     <>
-      <PointCloudListener checkMode={checkMode} toolInstanceRef={toolInstanceRef} />
+      <PointCloudListener
+        checkMode={checkMode}
+        toolInstanceRef={toolInstanceRef}
+        setResourceLoading={setResourceLoading}
+      />
       <div className={getClassName('point-cloud-layout')} onContextMenu={(e) => e.preventDefault()}>
         <div className={getClassName('point-cloud-wrapper')}>
           <AnnotatedAttributesPanelFixedLeft />

packages/lb-components/src/components/predictTracking/predictTrackingIcon/index.tsx

@@ -9,7 +9,7 @@ import { AppState } from '@/store';
 import {
   ChangeSave,
   GetBoxesByID,
-  SetPointCloudLoading,
+  SetAnnotationLoading,
   SetPredictResult,
   SetPredictResultVisible,
 } from '@/store/annotation/actionCreators';
@@ -77,7 +77,7 @@ const PredictTrackingIcon = (props: { loading: boolean; predictionResultVisible:
       }),
     );
 
-    SetPointCloudLoading(dispatch, true);
+    SetAnnotationLoading(dispatch, true);
     const result = predict(start, end);
     SetPredictResult(dispatch, result);
     SetPredictResultVisible(dispatch, true);

packages/lb-components/src/components/predictTracking/previewResult/index.tsx

@@ -8,7 +8,7 @@ import { PointCloudContext } from '@/components/pointCloudView/PointCloudContext
 import { AppState } from '@/store';
 import {
   BatchUpdateImgListResultByPredictResult,
-  SetPointCloudLoading,
+  SetAnnotationLoading,
   SetPredictResult,
   SetPredictResultVisible,
 } from '@/store/annotation/actionCreators';
@@ -41,9 +41,9 @@ const PreviewResult = (props: IProps) => {
   };
 
   const apply = async () => {
-    SetPointCloudLoading(dispatch, true);
+    SetAnnotationLoading(dispatch, true);
     await dispatch(BatchUpdateImgListResultByPredictResult());
-    SetPointCloudLoading(dispatch, false);
+    SetAnnotationLoading(dispatch, false);
     close();
   };
 
@@ -198,7 +198,7 @@ const GenerateViewsDataUrl = (props: {
         }
 
         setList(result);
-        SetPointCloudLoading(dispatch, false);
+        SetAnnotationLoading(dispatch, false);
       }
     };
 

packages/lb-components/src/store/annotation/actionCreators.ts

@@ -483,15 +483,16 @@ export const ToSubmitFileData = (submitType: ESubmitType) => (dispatch: any) =>
  * @param submitType
  * @param nextBasicIndex
  */
-const SubmitAndChangeFileIndex = (
+const SubmitAndChangeFileIndex = async (
   dispatch: any,
   nextIndex: number,
   submitType: ESubmitType,
   nextBasicIndex?: number,
-) => [
-  dispatch(ToSubmitFileData(submitType)),
-  dispatch(LoadFileAndFileData(nextIndex, nextBasicIndex)),
-];
+) => {
+  dispatch(ToSubmitFileData(submitType));
+  await dispatch(SubmitHandler(submitType));
+  dispatch(LoadFileAndFileData(nextIndex, nextBasicIndex));
+};
 
 const ChangeBasicIndex = (dispatch: any, nextBasicIndex: number) => [
   dispatch({ type: ANNOTATION_ACTIONS.SUBMIT_RESULT }),
@@ -636,10 +637,12 @@ export const DispatcherTurning = async (
       }
     }
 
+    const state = getState();
+
     annotationStore.onPageChange?.(fileIndex);
     const index =
       submitType === ESubmitType.Backward
-        ? getBasicIndex(getState().annotation, basicIndex)
+        ? getBasicIndex(state.annotation, basicIndex)
         : basicIndex;
 
     return SubmitAndChangeFileIndex(dispatch, fileIndex, submitType, index);
@@ -669,15 +672,6 @@ export const SetAnnotationLoading = (dispatch: Function, loading: boolean) => {
   });
 };
 
-export const SetPointCloudLoading = (dispatch: Function, loading: boolean) => {
-  dispatch({
-    type: ANNOTATION_ACTIONS.SET_LOADING,
-    payload: {
-      loading,
-    },
-  });
-};
-
 export const SetLoadPCDFileLoading = (dispatch: Function, loadPCDFileLoading: boolean) => {
   dispatch({
     type: ANNOTATION_ACTIONS.SET_LOADPCDFILE_LOADING,
@@ -725,3 +719,14 @@ export const PreDataProcess =
     const { annotation } = getState();
     return annotation?.preDataProcess?.(params) ?? params.dataList;
   };
+
+export const SubmitHandler = (submitType: ESubmitType) => async (dispatch: any, getState: any) => {
+  const { annotation } = getState();
+  const { onSubmit, imgIndex, imgList } = annotation;
+
+  if (!onSubmit) {
+    return;
+  }
+
+  await onSubmit([imgList[imgIndex]], submitType, imgIndex, imgList);
+};

packages/lb-components/src/store/annotation/reducer.ts

@@ -328,10 +328,6 @@ export const annotationReducer = (
         };
       }
 
-      if (onSubmit) {
-        onSubmit([newImgList[imgIndex]], action.payload?.submitType, imgIndex, newImgList);
-      }
-
       const stepProgress = calcStepProgress(newImgList, step);
       return {
         ...state,

packages/lb-components/src/views/MainView/index.tsx

@@ -57,6 +57,7 @@ const PointCloudAnnotate: React.FC<AppProps & IProps> = (props) => {
         checkMode={props.checkMode}
         intelligentFit={props.intelligentFit}
         measureVisible={props.measureVisible}
+        setResourceLoading={props.setResourceLoading}
       />
       <ToolFooter style={props.style?.footer} mode={props.mode} footer={props?.footer} />
     </>