fix: reporting error when clicking on the print button for the detail block (#3845)

This commit is contained in:
katherinehhh 2024-03-28 14:42:56 +08:00 committed by GitHub
parent 8a215e2fbe
commit e88082232d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 11 additions and 7 deletions

View File

@ -2,7 +2,7 @@ import { createForm } from '@formily/core';
import { useField } from '@formily/react'; import { useField } from '@formily/react';
import { Spin } from 'antd'; import { Spin } from 'antd';
import _ from 'lodash'; 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 { useCollectionParentRecord } from '../data-source/collection-record/CollectionRecordProvider';
import { RecordProvider } from '../record-provider'; import { RecordProvider } from '../record-provider';
import { BlockProvider, useBlockRequestContext } from './BlockProvider'; import { BlockProvider, useBlockRequestContext } from './BlockProvider';
@ -25,6 +25,7 @@ const InternalDetailsBlockProvider = (props) => {
const { resource, service } = useBlockRequestContext(); const { resource, service } = useBlockRequestContext();
const parentRecord = useCollectionParentRecord(); const parentRecord = useCollectionParentRecord();
const currentRecord = (action === 'list' ? service?.data?.data?.[0] : service?.data?.data) || {}; const currentRecord = (action === 'list' ? service?.data?.data?.[0] : service?.data?.data) || {};
const formBlockRef = useRef();
const detailsBLockValue = useMemo(() => { const detailsBLockValue = useMemo(() => {
return { return {
action, action,
@ -32,6 +33,7 @@ const InternalDetailsBlockProvider = (props) => {
field, field,
service, service,
resource, resource,
formBlockRef,
}; };
}, [action, field, form, resource, service]); }, [action, field, form, resource, service]);
@ -51,9 +53,11 @@ const InternalDetailsBlockProvider = (props) => {
return ( return (
<DetailsBlockContext.Provider value={detailsBLockValue}> <DetailsBlockContext.Provider value={detailsBLockValue}>
<RecordProvider isNew={false} record={currentRecord} parent={parentRecord?.data}> <div ref={formBlockRef}>
{props.children} <RecordProvider isNew={false} record={currentRecord} parent={parentRecord?.data}>
</RecordProvider> {props.children}
</RecordProvider>
</div>
</DetailsBlockContext.Provider> </DetailsBlockContext.Provider>
); );
}; };

View File

@ -6,4 +6,5 @@ export * from './FormFieldProvider';
export * from './TableBlockProvider'; export * from './TableBlockProvider';
export * from './TableFieldProvider'; export * from './TableFieldProvider';
export * from './TableSelectorProvider'; export * from './TableSelectorProvider';
export * from './DetailsBlockProvider';
export * from './hooks'; export * from './hooks';

View File

@ -1,9 +1,8 @@
import { useFormBlockContext } from '@nocobase/client'; import { useDetailsBlockContext } from '@nocobase/client';
import { useReactToPrint } from 'react-to-print'; import { useReactToPrint } from 'react-to-print';
export const useDetailPrintActionProps = () => { export const useDetailPrintActionProps = () => {
const { formBlockRef } = useFormBlockContext(); const { formBlockRef } = useDetailsBlockContext();
const printHandler = useReactToPrint({ const printHandler = useReactToPrint({
content: () => formBlockRef.current, content: () => formBlockRef.current,
pageStyle: `@media print { pageStyle: `@media print {