fix: fix the issue of empty data when opening popup in embedded page (#6086)

This commit is contained in:
Zeke Zhang 2025-01-18 17:55:42 +08:00 committed by GitHub
parent 04b817036f
commit d96afe674f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 59 additions and 25 deletions

View File

@ -289,13 +289,14 @@ export const useBlockAssociationContext = () => {
return useContext(BlockAssociationContext) || association;
};
export const useFilterByTk = () => {
export const useFilterByTk = (blockProps?: any) => {
const { resource, __parent } = useBlockRequestContext();
const recordIndex = useRecordIndex();
const recordData = useCollectionRecordData();
const collection = useCollection_deprecated();
const { getCollectionField } = useCollectionManager_deprecated();
const assoc = useBlockAssociationContext();
const association = useBlockAssociationContext();
const assoc = blockProps?.association || association;
const withoutTableFieldResource = useContext(WithoutTableFieldResource);
if (!withoutTableFieldResource) {
@ -344,8 +345,8 @@ export const useSourceIdFromParentRecord = () => {
* @internal
* @returns
*/
export const useParamsFromRecord = () => {
const filterByTk = useFilterByTk();
export const useParamsFromRecord = (props?: any) => {
const filterByTk = useFilterByTk(props);
const record = useRecord();
const { fields } = useCollection_deprecated();
const fieldSchema = useFieldSchema();

View File

@ -20,7 +20,7 @@ import {
* @returns
*/
export function useDetailsDecoratorProps(props) {
const params = useParamsFromRecord();
const params = useParamsFromRecord(props);
let parentRecord;
// association 的值是固定不变的,所以可以在条件中使用 hooks

View File

@ -10,8 +10,8 @@
import { observer, RecursionField, useField, useFieldSchema } from '@formily/react';
import { toArr } from '@formily/shared';
import _ from 'lodash';
import React, { FC, Fragment, useEffect, useRef, useState } from 'react';
import { useDesignable } from '../../';
import React, { FC, Fragment, useCallback, useEffect, useRef, useState } from 'react';
import { useDesignable, usePopupSettings } from '../../';
import { WithoutTableFieldResource } from '../../../block-provider';
import { CollectionRecordProvider, useCollectionManager, useCollectionRecordData } from '../../../data-source';
import { useOpenModeContext } from '../../../modules/popup/OpenModeProvider';
@ -47,6 +47,7 @@ export interface ButtonListProps {
label: string;
value: string;
};
onClick?: (props: { recordData: any }) => void;
}
const RenderRecord = React.memo(
@ -66,6 +67,7 @@ const RenderRecord = React.memo(
ellipsisWithTooltipRef,
value,
setBtnHover,
onClick,
}: {
fieldNames: any;
isTreeCollection: boolean;
@ -82,6 +84,7 @@ const RenderRecord = React.memo(
ellipsisWithTooltipRef: React.MutableRefObject<IEllipsisWithTooltipRef>;
value: any;
setBtnHover: any;
onClick?: (props: { recordData: any }) => void;
}) => {
const [loading, setLoading] = useState(true);
const [result, setResult] = useState<React.ReactNode[]>([]);
@ -126,6 +129,7 @@ const RenderRecord = React.memo(
}
if (fieldSchema.properties) {
onClick?.({ recordData: record });
openPopup({
recordData: record,
parentRecordData: recordData,
@ -209,6 +213,7 @@ const ButtonLinkList: FC<ButtonListProps> = (props) => {
ellipsisWithTooltipRef={ellipsisWithTooltipRef}
value={props.value}
setBtnHover={props.setBtnHover}
onClick={props.onClick}
/>
);
};
@ -254,12 +259,18 @@ export const ReadPrettyInternalViewer: React.FC = observer(
const { visibleWithURL, setVisibleWithURL } = usePopupUtils();
const [btnHover, setBtnHover] = useState(!!visibleWithURL);
const { defaultOpenMode } = useOpenModeContext();
const recordData = useCollectionRecordData();
const parentRecordData = useCollectionRecordData();
const [recordData, setRecordData] = useState(null);
const { isPopupVisibleControlledByURL } = usePopupSettings();
const onClickItem = useCallback((props: { recordData: any }) => {
setRecordData(props.recordData);
}, []);
const btnElement = (
<EllipsisWithTooltip ellipsis={true} ref={ellipsisWithTooltipRef}>
<CollectionRecordProvider isNew={false} record={getSourceData(recordData, fieldSchema)}>
<ButtonList setBtnHover={setBtnHover} value={value} fieldNames={props.fieldNames} />
<CollectionRecordProvider isNew={false} record={getSourceData(parentRecordData, fieldSchema)}>
<ButtonList setBtnHover={setBtnHover} value={value} fieldNames={props.fieldNames} onClick={onClickItem} />
</CollectionRecordProvider>
</EllipsisWithTooltip>
);
@ -268,7 +279,9 @@ export const ReadPrettyInternalViewer: React.FC = observer(
return btnElement;
}
const renderWithoutTableFieldResourceProvider = () => (
const renderWithoutTableFieldResourceProvider = () => {
if (isPopupVisibleControlledByURL()) {
return (
// The recordData here is only provided when the popup is opened, not the current row record
<VariablePopupRecordProvider>
<WithoutTableFieldResource.Provider value={true}>
@ -283,6 +296,26 @@ export const ReadPrettyInternalViewer: React.FC = observer(
</WithoutTableFieldResource.Provider>
</VariablePopupRecordProvider>
);
}
return (
<CollectionRecordProvider isNew={false} record={recordData} parentRecord={parentRecordData}>
{/* The recordData here is only provided when the popup is opened, not the current row record */}
<VariablePopupRecordProvider>
<WithoutTableFieldResource.Provider value={true}>
<RecursionField
schema={fieldSchema}
onlyRenderProperties
basePath={field.address}
filterProperties={(s) => {
return s['x-component'] === 'AssociationField.Viewer';
}}
/>
</WithoutTableFieldResource.Provider>
</VariablePopupRecordProvider>
</CollectionRecordProvider>
);
};
return (
<PopupVisibleProvider visible={false}>