From e88082232dd3a4bbef324d8d7e138d8b562e10f9 Mon Sep 17 00:00:00 2001
From: katherinehhh <shunai.tang@hand-china.com>
Date: Thu, 28 Mar 2024 14:42:56 +0800
Subject: [PATCH] fix: reporting error when clicking on the print button for
 the detail block (#3845)

---
 .../src/block-provider/DetailsBlockProvider.tsx      | 12 ++++++++----
 packages/core/client/src/block-provider/index.tsx    |  1 +
 .../plugin-action-print/src/client/utils.ts          |  5 ++---
 3 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/packages/core/client/src/block-provider/DetailsBlockProvider.tsx b/packages/core/client/src/block-provider/DetailsBlockProvider.tsx
index 8899a1e5a..a0abf1c1b 100644
--- a/packages/core/client/src/block-provider/DetailsBlockProvider.tsx
+++ b/packages/core/client/src/block-provider/DetailsBlockProvider.tsx
@@ -2,7 +2,7 @@ import { createForm } from '@formily/core';
 import { useField } from '@formily/react';
 import { Spin } from 'antd';
 import _ from 'lodash';
-import React, { createContext, useContext, useEffect, useMemo } from 'react';
+import React, { createContext, useContext, useEffect, useMemo, useRef } from 'react';
 import { useCollectionParentRecord } from '../data-source/collection-record/CollectionRecordProvider';
 import { RecordProvider } from '../record-provider';
 import { BlockProvider, useBlockRequestContext } from './BlockProvider';
@@ -25,6 +25,7 @@ const InternalDetailsBlockProvider = (props) => {
   const { resource, service } = useBlockRequestContext();
   const parentRecord = useCollectionParentRecord();
   const currentRecord = (action === 'list' ? service?.data?.data?.[0] : service?.data?.data) || {};
+  const formBlockRef = useRef();
   const detailsBLockValue = useMemo(() => {
     return {
       action,
@@ -32,6 +33,7 @@ const InternalDetailsBlockProvider = (props) => {
       field,
       service,
       resource,
+      formBlockRef,
     };
   }, [action, field, form, resource, service]);
 
@@ -51,9 +53,11 @@ const InternalDetailsBlockProvider = (props) => {
 
   return (
     <DetailsBlockContext.Provider value={detailsBLockValue}>
-      <RecordProvider isNew={false} record={currentRecord} parent={parentRecord?.data}>
-        {props.children}
-      </RecordProvider>
+      <div ref={formBlockRef}>
+        <RecordProvider isNew={false} record={currentRecord} parent={parentRecord?.data}>
+          {props.children}
+        </RecordProvider>
+      </div>
     </DetailsBlockContext.Provider>
   );
 };
diff --git a/packages/core/client/src/block-provider/index.tsx b/packages/core/client/src/block-provider/index.tsx
index 422b36faf..9074b0d19 100644
--- a/packages/core/client/src/block-provider/index.tsx
+++ b/packages/core/client/src/block-provider/index.tsx
@@ -6,4 +6,5 @@ export * from './FormFieldProvider';
 export * from './TableBlockProvider';
 export * from './TableFieldProvider';
 export * from './TableSelectorProvider';
+export * from './DetailsBlockProvider';
 export * from './hooks';
diff --git a/packages/plugins/@nocobase/plugin-action-print/src/client/utils.ts b/packages/plugins/@nocobase/plugin-action-print/src/client/utils.ts
index 23785a01e..1412c6f97 100644
--- a/packages/plugins/@nocobase/plugin-action-print/src/client/utils.ts
+++ b/packages/plugins/@nocobase/plugin-action-print/src/client/utils.ts
@@ -1,9 +1,8 @@
-import { useFormBlockContext } from '@nocobase/client';
+import { useDetailsBlockContext } from '@nocobase/client';
 import { useReactToPrint } from 'react-to-print';
 
 export const useDetailPrintActionProps = () => {
-  const { formBlockRef } = useFormBlockContext();
-
+  const { formBlockRef } = useDetailsBlockContext();
   const printHandler = useReactToPrint({
     content: () => formBlockRef.current,
     pageStyle: `@media print {